1、原因一:http請求次數太多
解決:減少http請求次數
① 圖片地圖:把多張圖片整合到一張圖片中,以位置定位超鏈接。
② CSS Sprites合併圖片,通過指定CSS的backgroud-image和backgroud-position來顯示元素。
③ 合併JS腳本和CSS樣式表。
④ 使用外部JS和CSS文件。
2、原因二:接收數據時間過長,如下載資源過大
解決:對HTTP傳輸進行壓縮,即在js,css、圖片等資源已經壓縮的基礎上,在HTTP傳輸過程中的再次壓縮。客戶端可以通過Accept-Encoding頭來聲明瀏覽器支持的壓縮方式,服務端通過Content-Encoding來啓用壓縮,配置壓縮的文件類型,壓縮方式。gzip使用無損壓縮,壓縮效果最佳,已經成爲使用最爲普遍、支持的瀏覽器最多的數據壓縮格式。
3、原因三:JavaScript腳本過大,阻塞了頁面的加載
解決:將JavaScript腳本放在</body>標籤前。script沒有async和defer時,JS文件將在下載後立即執行。這種情況下,script放在頂部會阻塞頁面呈現,在網速慢的情況下會導致“白屏”,直到腳本下載完畢才繼續呈現頁面。因此,script放在底部可以讓頁面儘快呈現。
4、原因四:CSS、JavaScript、圖片等需要重複加載
解決:靜態資源統一放在一個靜態域名上,減輕重複下載靜態資源的負擔。
5、原因五:cookie影響
解決:減小cookie的影響
① 去除沒有必要的cookie,如果網頁不需要cookie就完全禁掉。
② 將cookie的大小減到最小:減小HTTP請求報文的大小,提高響應速度。
③ 設置合適的過期時間:cookie信息將存儲到硬盤上,即使瀏覽器退出cookie還會存在,只要cookie未被清除且還在過期時間內,該cookie就會在訪問對應域名時發送給服務器。
④ 通過使用不同的domain減少cookie的使用:cookie在訪問對應域名下的資源時都會通過HTTP請求發送到服務器,但在訪問一些資源,如js,css和圖片時,大多數情況下cookie是多餘的,可以使用不同的domain來存儲這些靜態資源,這樣訪問這些資源時就不會發送多餘的cookie,從而提高響應速度。
6、原因六:網頁資源過多
解決:使用CDN部署網絡以提高下載速度,可以先通過免費的CDN供應商來分發網頁資源。