高性能網站進階指南 筆記

一、優化循環遠遠比優化只執行一次的代碼好得多；

二、DOM API效率低下，運行程序最大開銷每每是DOM而不是Javascript；

三、當咱們作性能優化時，不要浪費時間去嘗試爲那些不消耗大量時間的代碼提速。評估優先，拒絕任何不能提供良好效益的優化；

四、瀏覽器在執行頁面的Javascript期間沒法響應其餘的用戶事件。所以，儘量快地執行完頁面中全部的Javascript是極其重要的，不然網頁和瀏覽器自己可能變得很是緩慢甚至徹底凍結；

五、webwork有助於提高瀏覽器的使用效率，將一些複雜運算放到後臺計算，將串行變爲並行；

六、在頁面加載時，經過控制Javascript的函數數量加載量能夠加快網頁的初始化速度。（指在onload事件執行以前的下載量）；

七、幾種下載外部腳本且不被阻塞的技術：

XHR Eval

經過XMLHttpRequest從服務器端獲取腳本，響應完成時經過eval執行內容。缺陷：不能跨域。

XHR 注入

經過XMLHttpRequest從服務器端獲取腳本，響應完成時經過建立script元素注入其中執行內容。缺陷：不能跨域。

Script in Iframe

經過iframe的src屬性加載腳本。

Script DOM Element

經過建立script標籤元素來加載腳本。

Script Defer

IE特有

document.write Script Tag

經過把script標籤代碼用write方法放到頁面中加載腳本。

八、瀏覽器忙指示器

圖片丟失

九、腳本下載技術最佳方案決策樹

十、解決異步腳本按順序執行的辦法

     硬編碼回調

     window onload

     定時器輪詢

     script onload(首選)

十一、樣式表的下載會阻塞行內腳本

解決方案：調整行內腳本的位置，使其不出如今樣式表和任何其餘資源之間。

十二、http協議 chunked狀態碼

 通常狀況HTTP的Header包含Content-Length域來指明報文體的長度。如：

      

     有時候服務生成HTTP迴應是沒法肯定消息大小的，好比大文件的下載，或者後臺須要複雜的邏輯才能所有處理頁面的請求，這時用須要實時生成消息長度，服務器通常使用chunked編碼。

     在進行Chunked編碼傳輸時，在回覆消息的Headers有transfer-coding域值爲chunked，表示將用chunked編碼傳輸內容。使用chunked編碼的Headers以下（能夠利用FireFox的FireBug插件或HttpWatch查看Headers信息，HttpWatch還能夠查看chunked的個數）：

     

     chunked採用如下方式編碼：

     Chunked-Body=*chunk 

"0"CRLF 

footer 

CRLF 

chunk=chunk-size[chunk-ext]CRLF 

chunk-dataCRLF 

hex-no-zero=<HEXexcluding"0"> 

chunk-size=hex-no-zero*HEX 

chunk-ext=*(";"chunk-ext-name["="chunk-ext-value]) 

chunk-ext-name=token 

chunk-ext-val=tokenquoted-string 

chunk-data=chunk-size(OCTET) 

footer=*entity-header

     編碼使用若干個Chunk組成，由一個標明長度爲0的chunk結束，每一個Chunk有兩部分組成，第一部分是該Chunk的長度和長度單位（通常不寫），第二部分就是指定長度的內容，每一個部分用CRLF隔開。在最後一個長度爲0的Chunk中的內容是稱爲footer的內容，是一些沒有寫的頭部內容。

1三、gzip壓縮原理：經過添加Accept-Encoding HTTP頭來向Web服務器聲明支持壓縮：Accept-Encoding：gzip，deflate，當請求中包含這個頭時，web服務器就會開啓Gzip壓縮功能。Web服務器會返回一個通過壓縮的響應，而且用Content-Encoding頭作標記：Content-Encoding：gzip。

1四、能夠經過事件委託來減小事件的綁定從而減小文件的大小。

1五、圖片壓縮技術

1六、可使用多個域來下載靜態資源，提升網頁加載速度。特別是一些靜態資源不少的網站。

1七、現在大多數Web客戶端和服務器端都使用HTTP/1.1，但也繼續支持HTTP/1.0。在使用HTTP1.1時，許多瀏覽器遵循HTTP/1.1 RFC中的建議，限制每一個服務端兩個鏈接。然而當使用HTTP/1.0時，IE6和7能夠打開更多的鏈接，一般增長到4個。相似的，FF增長到8個。降級到http 1.0能夠加快並行下載速度，可是代價是放棄長鏈接。

1八、少用iframe，iframe是開銷最大的DOM元素。

1九、高效css選擇符使用