一般而言，關(guān)于網(wǎng)站加速，大部分人認(rèn)為是后端開(kāi)發(fā)者和系統(tǒng)管理的職責(zé)。這種觀點(diǎn)不完全正確，因?yàn)橐粋€(gè)高性能的網(wǎng)站，不僅取決于網(wǎng)站的后端，還依賴網(wǎng)站的前端，也就是說(shuō)還依賴于美工和前端開(kāi)發(fā)人員。

事實(shí)上，就目前的網(wǎng)絡(luò)環(huán)境來(lái)看，我們?cè)跒g覽正常的網(wǎng)站時(shí)，通?？偤馁M(fèi)時(shí)間的10-20%用在了后端，剩下80-90%的時(shí)間被前端所消耗。所以，如果 你計(jì)劃提升網(wǎng)站的速度，不妨在優(yōu)化后端的同時(shí)，讓美工和前端開(kāi)發(fā)人員考慮以下幾個(gè)方面。相信你可能會(huì)感嘆，不大動(dòng)刀戈也可以有效地提升網(wǎng)站的性能。

1. 盡可能減少 HTTP 請(qǐng)求的次數(shù)。

例如：用一張圖片代替多張圖片，再用CSS顯示。

2. 采用CDN對(duì)網(wǎng)站加速。

CDN可以在不改動(dòng)原有網(wǎng)站架構(gòu)的前提下，很大幅度地提升網(wǎng)站的訪問(wèn)速度。特別是對(duì)于那些擁有全國(guó)(或世界各地)用戶的網(wǎng)站，效果會(huì)更加明顯。

3. CSS文件放在頁(yè)面頭部。

瀏覽器在顯示頁(yè)面之前，必須要得到CSS。否則無(wú)法顯示網(wǎng)頁(yè)。所以，將CSS文件 放在頁(yè)面頭部是明智之舉。伯樂(lè)在線的開(kāi)發(fā)團(tuán)隊(duì)曾經(jīng)做過(guò)測(cè)試，如果一張網(wǎng)頁(yè)包括多個(gè)JS文件，同時(shí)CSS文件放在網(wǎng)頁(yè)最后。用戶瀏覽網(wǎng)頁(yè)時(shí)，非常明顯地感覺(jué) 到網(wǎng)頁(yè)先是空白(下載JS和其他文件)，然后再顯示出來(lái)。

顯然，這種情況下，用戶體驗(yàn)是非常差的。與此相反，如果將CSS文件放在頁(yè)面頭部，用戶瀏覽網(wǎng)頁(yè) 時(shí)，可以先看到網(wǎng)頁(yè) (網(wǎng)頁(yè)無(wú)明顯空白)。

4. JS文件放在頁(yè)面尾部。

道理和CSS文件放在頁(yè)面頭部一樣。

5. 將CSS和JS代碼單獨(dú)存放在獨(dú)立于網(wǎng)頁(yè)的文件中。

現(xiàn)在很多的瀏覽器，如Firefox， IE 7，8 等等都會(huì)將圖片，CSS，JS等外部的文件緩存在用戶本地，所以，用戶通過(guò)這些瀏覽器瀏覽網(wǎng)頁(yè)時(shí)只傳輸網(wǎng)頁(yè)的文本內(nèi)容，不再次下載圖片，CSS，JS等外 部的文件。這樣一來(lái)，訪問(wèn)的速度自然可以提升不少。另外，將CSS和JS代碼單獨(dú)存放在獨(dú)立于網(wǎng)頁(yè)的文件，也便于管理。

6. 對(duì)JS“瘦身”。

用第三方的工具(不需要手工)對(duì)JS進(jìn)行壓縮，包括刪除注釋，空格等等，通常情況下可以減小20%左右。例如，未“瘦身”前JS為100KB， “瘦身”后80KB.

除第2項(xiàng)外，其他5個(gè)方面都是和美工和前端開(kāi)發(fā)人員相關(guān)。更多未提到的技巧，歡迎補(bǔ)充。

原文地址：http://forum.jobbole.com/showthread.php/1417

【編輯推薦】

1. 10個(gè)技巧讓你的網(wǎng)站“財(cái)源滾滾”
2. 4月份9款jQuery插件推薦 增加網(wǎng)站亮點(diǎn)
3. 穩(wěn)捷網(wǎng)絡(luò)保護(hù)網(wǎng)站遠(yuǎn)離SQL注入攻擊
4. 推薦34個(gè)非常漂亮的單頁(yè)網(wǎng)站設(shè)計(jì)案例