淺談前端優化的幾個思路

ltoddy發表於2019-02-16

淺談前端優化的幾個思路

https://ltoddy.github.io

雪碧圖

頁面中如果有很多圖片、icon(小圖示),這樣會有很多HTTP請求,一個圖就是一個HTTP請求,建立TCP連線進行三次握手,這些都是耗費時間的.如果頁面icon很多,可以考慮用css spirit(精靈,汽水雪碧也是這個單詞)技術做一張雪碧圖,將請求多個icon變成一次HTTP請求.(可以用webpack來配置實現)

lazy load (懶載入)

如果頁面內容多,頁面長度長的話,可以考慮懶載入,先載入頁面最上面的內容,然後滑動到哪載入到哪.

CDN

這個是一個很大的關鍵,在公司靜態資源肯定是走CDN服務的,什麼是CDN呢,比如,你去網路請求一個資源,你在北京,而資源在南京,
中途很遠,要經過很多個路由器(轉發請求),這樣會佔用很多時間.所以可以用CDN服務,簡單來說CDN就是在各個地區佈置節點,
快取你的資源,這樣你就可以就近的拿到你要的資源了.

webpack配置

聽說大公司都有專門寫webpack配置檔案的崗位,webpack如果配置的好,也可以提高很多速度(比如可以把你的js檔案壓縮的更小).

前端攔截

前端也是可以做資料嬌豔以及重定向這樣的事情,能前端決策的一定要決策,因為比如重定向在前端做了,這樣就不需要訪問後端,也可以減小伺服器的壓力.

最後一點,程式碼質量

我前端框架用的是react,要多多關注react生命週期,等等很多方面.

相關文章