性能黃金法則：
只有10%~20%的最終用戶響應時間花在了下載HTML文檔上。其余的80%~90%時間花在了下載頁面中的所有組件上。
規則1 減少HTTP請求
可以通過使用圖片地圖，CSS Sprites（有利有弊），內聯圖片（data：URL模式，IE不支持，不能被緩存），合並腳本和樣式表。
規則2 使用內容發布網絡
如果應用程序web服務器離用戶更近，則一個HTTP請求的響應時間將縮短 ；
如果組件web服務器離用戶更近，則多個HTTP請求的響應時間將縮短。
內容發布網絡（CDN）是一組分布在多個不同地理位置的web服務器，用於更加有效地向用戶發布內容。
規則3 添加Expires頭
web服務器使用Expires頭告訴web客戶端他可以使用一個組件的當前副本，直到指定的時間為止。要求服務器與客戶端的時鐘嚴格同步，並且要在時間過期後在服務器配置中提供一個新的日期。
Max-Age和mod_expires可以彌補Expires的不足。
規則4 壓縮組件
從HTTp1.1開始，
規則5 將樣式表放在頂部
逐步呈現，避免白屏
規則6 將腳本放在底部
HTTP1.1規范建議浏覽器從每個主機名並行下載兩個組件，在下載腳本時，並行下載實際上是被禁用的。
原因之一是腳本有可能使用document.write來修改頁面內容，因此浏覽器會等待，以確保頁面能夠恰當地布局；
原因之二是為了保證腳本能夠按照正確的順序執行，如果並行下載多個腳本，就無法保證響應是按照特定順序到達浏覽器。
將腳本放在頂部將會阻塞對其後面內容的呈現，並且會阻塞對其後面組件的下載。
規則7 避免CSS表達式
表達式expression方法被其他浏覽器忽略，但是對於IE來說是一個有用的工具。能夠在IE中設置屬性，創建跨浏覽器的一致體驗。例如，IE[IE6，IE7（Quirk），IE8（Quirk]不支持min-width屬性，用表達式的方法可以解決這一問題：
復制代碼代碼如下:
width: expression(document.body.clientwidth<600?"600px": "auto");
min-width: 600px;
表達式的問題在於對其進行的求值的頻率比人們期望的要高。他們不僅在頁面呈現和大小改變時求值，當頁面滾動甚至用戶鼠標在頁面上移過時都要求值。我們可以向CSS表達式中添加一個計數器來進行跟蹤。
表達式計數器的實例：
http://stevesouders.com/hpws/expression-counter.php
復制代碼代碼如下:
P {
width: expression(setCntr(),document.body.clientwidth<600?"600px": "auto");
min-width: 600px;
}
取代表達式的方法：事件處理器（Event Handlers）
通過在onresize事件中設置樣式的width屬性來修正min-width問題。
事件處理器的實例：
http://stevesouders.com/hpws/event-handler.php
當浏覽器的大小改變時，這個例子使用setMinWidth()函數來修改所有段落元素的大小——
復制代碼代碼如下:
function setMinWidth(){
setCntr(); //用於顯示求值次數
var aElements = document.getElementsByTagName("p");
for(var i=0;i<aElements.length;i++){
aElements[i].runtimeStyle.width=(document.body.clientwidth<600?"600px": "auto");
}
}
if(1!=navigator.userAgent.indexOf("MSIE")){
window.onresize=setMinWidth;
}
這會在浏覽器改變大小時中動態設置寬度，但是第一次呈現時這並不能恰當地設置段落大小，因此，頁面還需要使用“一次性表達式”，通過表達式設置初始寬度。
規則8 使用外部JavaScript和CSS
規則9 減少DNS查找
規則10 精簡JavaScript
精簡VS混淆VS壓縮
規則11 避免重定向
當Web服務器向浏覽器返回一個重定向是，響應中就會擁有一個范圍在3xx的狀態碼。這表示用戶代理必須執行進一步操作才能完成請求。
重定向影響的是HTML文檔的下載。
規則12 移除重復腳本
規則13 配置ETag
規則14 使Ajax可緩存
最後奉上本書的內容提綱，以備復習使用！