這段時間忙的薅頭髮，筆記都沒怎麼寫了，要捱罵。。。。

閱讀一篇放鬆一下心情。

效能影響使用者是毫無疑問的。網站速度直接影響反彈率、轉化率、收入、使用者滿意度、搜尋引擎優化（已知的如反映網站流行度的Page Rank）以及幾乎所有值得追蹤的業務。使用者離開速度慢的網站，而且往往不會再回來。

還在不久前，使用者離開一個網站的時間點是8秒。然而，很快就是6秒，然後4秒，然後現在是2秒。門檻一直在提高。

小小效能改變，大大影響發生
使用者的耐心不是線性的。第1秒的時候基本上沒有人會放棄這個站點。但是，1秒開外之後，如果沒有適當的反饋的話（例如瀏覽器標頭顯示頁面標題），使用者開始以一個加速的比率離開。到3~4秒的時候，一般的站點會一半的潛在使用者。當然，具體的閾值根據網站、使用者行為和意圖以及其他因素不同而有所不同……但萬變不離其宗。

瓶頸
快速測試：當HTML載入瀏覽器之後，使用者等待你頁面載入的時間百分比是多少？如果你不是做web開發的，或是經常混跡於效能社群的話答案可能會讓你大跌眼鏡。一般超過90%，使用者花在等待上的時間的90%實在頁面HTML載入到瀏覽器之後。為什麼會這樣呢？

獲取HTML僅僅是個開始

大肆分析瀏覽器是如何工作有點超出範圍了，不過總的來說，瀏覽器解析HTML是有序地發現的資源（如指令碼，樣式和圖片）、請求，然後要麼解析，要麼執行或者就是適時顯示。

但是這些資源並不是一次性獲取的。相反，瀏覽器通過頁面只能向伺服器開啟有限數量的連線，通過建立TCP和HTTP連線和一些不可避免的延遲，傳送的請求和響應的位元組通過網路傳回來。

因此，一般而言，瀏覽器和伺服器之間的雙向運輸的代價是昂貴的。HTML的結果標記，資源的數目和順序是效能上絕對關鍵的因素。

在我們關心假期網站訪問量之前，我們花個幾分鐘看看web開發者和網站站長關於網站效能所犯的7大錯誤，以及如何避免和糾正的一些建議。

1. 太多的HTTP請求
這是絕對多數網頁效能問題的癥結所在，許多有效的解決該問題的WPO技術是完全不同的方法，下面就是一些：

合併指令碼和樣式

簡單地將指令碼檔案們合併成一個。對於樣式，可以直接把所有.css檔案合併成一個。人工維護需要很大成本，但目前有自動化的解決方案。

合併圖片為Sprites

CSS Spriting已經變成主流技術。其做法是將很多個公共圖片合併為一個大的圖片檔案，然後你通過CSS控制位置讓圖片需要的地方顯示。於是，告別N多圖片，現在只有一個。
事先提醒一句，這個技術的維護是很折騰的，因為即使是個很小的更改也要更新整個圖片以及CSS，甚至是HTML。幸運的是，CSS spriting自動化工具如SpriteMe, Compass, Yottaa

使用盡量少的圖片

在一個頁面上行使用太多圖片是個老大難問題了，其歷史可以追溯到古老的img標籤。一般有兩類解決方法。其一是使用CSS代替圖片檔案(background-color, border, buttons, hover效果等)，另外則是對小圖使用”data URIs“
當圖片對於頁面是必需的情況下我們可以考慮影象的分頁，例如電子商務的目錄。

另外的解決方法可能就有些強硬了：就是讓設計師或是產品所有者建立簡單的不需要很多圖片的頁面。

使用盡量少的圖片

在一個頁面上行使用太多圖片是個老大難問題了，其歷史可以追溯到古老的img標籤。一般有兩類解決方法。其一是使用CSS代替圖片檔案(background-color, border, buttons, hover效果等)，另外則是對小圖使用”data URIs“
當圖片對於頁面是必需的情況下我們可以考慮影象的分頁，例如電子商務的目錄。

另外的解決方法可能就有些強硬了：就是讓設計師或是產品所有者建立簡單的不需要很多圖片的頁面。

2. 客戶端最低限度處理

很多站點不能很好地運用客戶端的能力，而把所有的工作都交給伺服器。舉個簡單的例子，如表單驗證：把表單資料傳送給伺服器，在伺服器端驗證，然後返回錯誤資訊。oh, my GAGA, 這可不是一般的低效啊。
客戶端的驗證

相反，驗證使用者輸入的資訊應該在頁面內，就在輸入發生的地方。由於安全的原因，網頁應用程式也應該在伺服器端驗證。web安全準則之一即是不能相信使用者的輸入。所以，客戶端的驗證是出於效能和互動的原因，而伺服器端的驗證是出於安全原因。
使用網路標準和MVC分離

使用web標準對於建立易維護，可訪問，易證明的站點是很關鍵的。其也效能最佳化最好的基礎。使用現代網路標準鼓勵內容(HTML)，樣式(CSS)和行為(JavaScript)分離。
換句話說，歷史悠久的”MVC”[[Model/View/Controller]設計模式正在你的網站程式碼中發揮著作用。

把HTML（實為DOM）當作module，CSS作為view，JavaScript作為controller。這種分離會使程式碼更高效，更利於維護，也使得很多優化技術的應用更為可行。

演示程式碼放到客戶端

上面提到的表單驗證的例子，很多場景要求客戶端做的更多。圖表和形狀——任何形式耐看的視覺化資料——曾經必須依靠伺服器端。
黃鶴一去不復返。現在它就是把資料從伺服器端推送到客戶端（例如JSON格式），然後使用CSS和JavaScript在瀏覽器中建立漂亮的圖形，圖表，視覺化內容。這種方法避免了很多與伺服器的互動，可以說，伺服器做了更有意義的事情。

因為僅僅是推送資料，因此，節約了伺服器的CPU，縮短了等待時間，並利用未充分利用的資源提供給每個客戶端。有不少很讚的工具可以資料的視覺化處理，包括：Processing, D3 和 Flot

利用Ajax技術

只讓頁面需要的一小部分去響應使用者的操作，可以讓你的網站或web程式變得更加的互動和高效。這有多種方法（例如獲取HTML或指令碼或資料）。如果你不需要的話，你可以不要重新整理整個頁面！如果你還未加入Ajax的大家庭，這本書雖然有些年頭了但是概述是相當棒的！

. 低並行請求數
獲取一個指令碼，然後解析它，執行它，再獲取下一個，如此往復。然後使用所有可用的連結，從同一個伺服器下載一些圖片。它們一旦下載完畢，然後獲取其他。聽上去有效？事實並非如此。使用者的頻寬往往不是限制的主要因素，相反，是沒有考慮到瀏覽器的行為低效的標記。

你可以通過一些舉措讓所有瀏覽器一次可以發出更多的請求，這對於延遲很有效果。

使用瀏覽器相應域分割槽

一些老的單依舊流行的瀏覽器，如IE7，有個稱為“域分割槽”的東西。具體來講就是使用指向同一伺服器但不同的域名來提高每次頁面的請求數目。例如img1.foo.com和img2.foo.com要比單純使用img.foo.com兩倍高效下載。注意，對於新興瀏覽器，這個技術不適合，因為你需要承擔DNS成本而實際並未帶來什麼好處。

使用智慧指令碼載入

現在的指令碼下載器激增，這些可以最優化多個指令碼下載的效能。這些指令碼下載器通常都是採用非同步下載，避免預設的指令碼阻塞等問題。關於指令碼下載，可以多多參考《高效能網站進階指南》一書，這裡不多囉嗦。

4. 沒有使用瀏覽器快取或本地儲存

顯然，最快的獲取資源的方法就是從本地快取中獲取了。

使用正確的header

為靜態資源設定長時間快取頭，尤其是這些資源被多個頁面呼叫的時候，這是一個很好的提高效能的方法。因為明確的客戶端快取失效是不可能的，更新快取內容的方法一般是對其名字進行處理。
還有另外一種技術，如果你手動做的話代價較高，如果自動化（例如通過指令碼構建）就很迅速。這個方法就是使用”Expires”頭。由於經常更新內容，使用”Last-Modified”響應頭，以便在瀏覽器中觸發條件”If-Modified-Since”請求。條件請求要明顯慢於本地快取查詢，但遠遠高於一個完整的返回。

使用本地儲存(local storage)

一個WPO新利器就是HTML5中的local storage。對於支援的瀏覽器，其儲存要比cookie精確很多很多，而且跟cookie相比，其請求無壓力。

5. 第三方外掛

第三方元件很多時候就是網頁效能禍根。

避免第三方外掛

必要的外掛有時候還是需要的，但是，為了避免最後搞得像瘟疫一樣，避免使用之。
使用非同步實現

對於嘗試使用的外掛，最好採用非同步實現。以避免其糟糕的效能拖累你整個頁面的互動體驗。
效能測量（停止使用低效能的）

如題。

6. 太多的位元組數

有不少方法可以讓響應的尺寸更小。

壓縮

一個很明顯也很重要的方案就是引入壓縮(gzip)。客戶端輕微的解壓效能損失通常通過較少延遲，和較少位元組緩解。在伺服器端，預壓縮靜態資源有助於較小CPU的開銷。像Apache的mod_deflate中的伺服器端解決方案，壓縮動態內容，以確保壓縮的內容傳送到客戶端並可以處理它（像請求頭表示的”Accept - Encoding:GZIP, DEFLATE”）。
需要注意的是和快取相結合的壓縮。確保使用”Vary: Accept-Encoding”頭，以便快取可以響應合適的請求內容。

其他技術包括：

更徹底的內容編輯
影象優化(http://www.smushit.com/ysmush.it/)
JavaScript和CSS重構和最小化
客戶端程式碼重用
分頁
Ajax
cookie的域（圖片等靜態資源）

7. 未使用全球網路

另一個常見錯誤就是忽略地理位置。如果您的網站是在紐約市的資料中心託管，在加利福尼亞州的使用者和波士頓的使用者（更不用說亞洲）有一個巨大差異的延遲。傳統DNS服務內容扮演的是邊緣角色。使用雲服務提供商釋出內容至更多的地點，使使用者總是從他們附近的伺服器獲取，這比DNS更好。

像Yottaa尖端的網路效能優化服務，可以跨多個雲服務提供商的路由請求您的網頁，其內容分發到世界各地的使用者，代表了不同地域使用者優化的下一代解決方案。

效能問題，特別是在假期前後。在黑色星期五，網路星期一之前，衡量你的網站的效能，然後改進它。

不管你是手工，是關注建立時間，是部署時間，還是伺服器響應時間，或是在雲端處理你最喜歡的效能優化服務……Just do it!