增進網站效能的14條法則

分類: 技術分享 作者: abu

25 6 月 2009

來源:史丹佛大學 9/22 講義
主題:High Performance Web Sites


1減少HTTP requests
1.不使用影像地圖
2.使用CSS Sprites,將網頁上需要用的圖片,全部結合成一張,再使用background-position去顯示
3.將javascript合併在同一支js裡面,不要分散很多支
4.圖片直接使用img標籤載入,會較css方式載入快很多

2使用內容分發網路Use a content delivery network
使用分散網路架構,讓用戶能更快速取得資料
參考:http://big5.xinhuanet.com/gate/big5/news.xinhuanet.com/internet/2007-05/24/content_6143701.htm

3Expires Header
設定HTTP 協定中 Expires 這個 header tag,讓靜態的圖片和js可直接從本地端取出
參考:http://broso.twbbs.org/blojsom/blog/default/ITTech/Apache/?permalink=Speeding-up-your-web-site.html&smm=y

4壓縮html和樣式表程式碼

5將css使用link方式放在head區間

6將script擺放於html最下面

7避免使用動態CSS

8將javascript和css擺在外部檔案

9使用Keep-Alive和較少的domain
HTTP Keep-Alive 回應標頭會在伺服器的多個要求之間將用戶端/伺服器連線保持在開啟的狀態,藉以改善網頁伺服器效能。

10精簡javascript程式碼

11避免導向

12避免重複載入scripts

13重新定義ETags或是移除他
參考:http://developer.yahoo.com/performance/rules.html#etags

14使用ajax cache

在這個網站努力的拜讀:http://stevesouders.com/hpws/rule-min-http.php,整個英文網站看了一遍,網站上也有些示範,經由設定之後,網頁重載的速度確實變快了 ( 部份範例需在IE下才有用 ),很多細節是專案製作時,需要注意到的地方,以及利用技術輔助,不過覺得還是要實際應用在專案上,可能會比較有感覺,看完原文網站以後,才發現國內有中文翻譯版,不過,可能就像阿丹說的,自己看過比較有印象,所以,研讀原文應該還是對自己很多幫助吧?!

我要留言

關於這裡

這個部落格分享了哇寶在電子商務領域的技術及資訊,希望能讓更多人一起為台灣的網路產業加油。