首頁 >web前端 >js教程 >網站效能優化相關知識點

網站效能優化相關知識點

巴扎黑
巴扎黑原創
2017-06-26 11:55:311418瀏覽

本文提到的網站效能指網站的反應速度,這也符合絕大部分人對於網站效能的理解:存取快速的網站效能好,反之,存取速度越慢,則網站效能越差。本文總結的最佳化方法是宏觀的工程層面的方法,並不包含微觀的語言語法層面的方法,例如,JS、CSS的語法優化,這一部分同樣影響網站的性能,但語言語法層面的優化更多的是取決於開發人員的程式設計等級。

什麼樣的網站回應速度快呢?其實很容易想到,網站載入資源的速度越快,網站回應速度越快;網站需要載入的資源越少,網站回應速度越快。這就分別對應網站效能最佳化的兩大方向:資源快取、資源合併壓縮。當瀏覽器完成資源的載入後,需要進一步解析資源,才能渲染出最終的網頁,所以,瀏覽器的解析機制也是網站效能最佳化的一個方向。各種最佳化方法都可以歸類到這三個大方向。

1.資源快取

1.1 使用CDN

將網站的靜態資源分離,如靜態HTML、圖片Image、樣式CSS、腳本JS等,把靜態資源部署到CDN中,可以明顯加快這部分資源的載入速度。

1.2 利用HTTP快取機制

HTTP快取會把瀏覽器載入過的資源快取到本地,下次載入時,只要快取的資源沒有過期,就可以直接使用本地的資源,減少了HTTP請求次數,加快了資源載入速度。具體做法是設定HTTP Header 中的Cache-Control參數。 HTTP 1.0 中使用Pragma和Expires兩個參數進行緩存,不過早已不建議使用。

2. 資源的合併壓縮

2.1 減少HTTP請求

用一個HTTP請求去載入一個10M的文件,和把這個文件拆分成1M的10個文件,用10個HTTP請求並行去加載,哪一種方式能更快完成加載?既然提到減少HTTP請求可以提高網站回應速度,那麼結論似乎應該是用一個HTTP請求的方式更快。其實正確的答案是:不一定!

我做了一個小實驗:有兩個html文件,index1.html和index2.html,index1.html中用1個