天天看點

【性能優化專題】-web網頁端性能優化之浏覽器端優化

web網頁性能優化主要有兩種方式,一種是優化伺服器端,也即是後端的優化,後端優化也是最關鍵,效果最明顯的,當後端優化做到極緻後,前端優化也不可忽視,作為一名後端,對前端優化不說全部掌握,至少要有所了解,在需要時做到有計可施可也...

關于後端優化,涉及的内容極多,有興趣的可以參考這篇: (創作中,好了會及時在這裡更新為URL)

浏覽器端的優化主要有以下幾種方式:

1.壓縮源碼和圖檔

JavaScript檔案源代碼可以采用混淆壓縮的方式,CSS檔案源代碼進行普通壓縮,JPG圖檔可以根據具體品質來壓縮為50%到70%,PNG可以使用一些開源壓縮軟體來壓縮,比如24色變成8色、去掉一些PNG格式資訊等。

2.如果圖檔顔色數較多就使用JPG格式,如果圖檔顔色數較少就使用PNG格式.

3.合并靜态資源

包括CSS、JavaScript和小圖檔,減少HTTP請求。有很大一部分使用者通路會因為這一條而取得最大受益.

4.開啟服務端的Gzip壓縮

這對文本資源非常有效,對圖檔資源壓縮效果感人...

5.使用CDN靜态資源加速

使用CDN加速或者一些公開庫使用第三方提供的靜态資源位址(比如jQuery、normalize.css)。一方面增加并發下載下傳量,另一方面能夠和其他網站共享緩存。這裡推薦一個免費開源的CDN加速網站:https://www.bootcdn.cn/

6.根據情況延遲靜态資源的緩存儲存時間

如此,頻繁通路網站的訪客就能夠更快地通路。不過,這裡要通過修改檔案名的方式,確定在資源更新的時候,使用者會拉取到最新的内容。

7、把CSS放在頁面頭部,把JavaScript放在頁面底部

這樣就不會阻塞頁面渲染,讓頁面出現長時間的空白。

繼續閱讀