頁面效能最佳化-減少HTTP請求

Yahoo 頁面效能的第一個原則就是：減少HTTP 要求。
　　80%的終端使用者請求時間花費在前端。這些時間的大部分停滯在下載頁面中的組件：圖片，樣式表，scripts，Flash等等。反過來減少組件的數量就可以減少需要提交頁面的HTTP請求數量。這是加速頁面的關鍵。
減少HTTP請求數量的技術包括：合并檔案(Combined files)、CSS Sprites、映像區塊(Image maps)、內聯圖片(Inline images)等等。
　　頁面上的資料，通過TCP/IP包傳輸。在1M ADSL環境下，網速最大值為128Kb/s,MTU(Maximum Transmission Unit)的大小預設為1500bytes.去掉TCP/IP的頭部資訊40bytes,一個package可以容納的大小為1460bytes。下面是一種：

當需要的包越少時，速度也就越快。

例子：一張圖片的大小為 5.71 KB (5848 bytes). 需要 5 個包來傳輸（5848 / 1460 = 4.005）。看資料，只多出了 8 bytes. 最佳化到 5840 bytes 後，就可以減少一個傳輸包。

也許吹毛求疵了，但對於關鍵頁面，任何細節最佳化，有時都是值得的。

類似的，對於頁面中的連結數量，也可以考慮瀏覽器的最大並發數來做細節最佳化。比如，在 Firefox 下，同一個 host 的最大並發數為 6, 增加連結數對下載時間的影響如下：

當連結數從 6 的整數倍增 1 時，下載時間明顯增大。考慮 IE6 最大並發數是 2, 減少連結數時，盡量減少到偶數，是一個不錯的最佳化規則。

參考資料：
http://lifesinger.org/blog/2009/07/css-sprite-performance/
http://developer.yahoo.com/performance/rules.html