淺談前端優化的幾個思路

淺談前端優化的幾個思路

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生命週期,等等不少方面.