淺談打開網頁速度慢的原因和解決方法

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供應商來分發網頁資源。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章