web前端優化手段有很多,同種的優化方式或許在不同的網路協議會南轅北轍,下面就自己結合工作經驗和學習總結的一些手段總結
3、cookie-free:將資源的站點都重定向到非頁面站點,如:頁面都是*.100bt.com,將資源站點都放在resource.a0bi.com站點。
4、多站點放置資源,繞開瀏覽器的同站點資源載入個數的限制。
5、非同步載入js檔案,非基礎庫script加上async/defer。
6、按需載入檔案,如:在相應式頁面中,判斷使用者裝置獲取所需的檔案。
8、減少dom操作(感覺在現代瀏覽器意義不大)
9、快取需要多次操作的dom節點
10、基礎庫的過期時間設定盡量大,充分利用頁面快取
11、使用worker
12、使用cdn
13、使用gzip壓縮
14、使用css3/canvas/svg 代替,使用data:image代替png
15、使用offline
16、dns預讀取(dns-prefetch)prefetch subresource prerender
17、分布載入頁面ajax/bigpipe
18、 避免重複的資源請求,不同模組同時請求相同資源,會導致資源的重複請求
19、減少reflow/repaint
20、使用switch-case不用if-else,使用while不使用for
21、ui動畫使用requestanimationframe
代替settimeout和setinterval
22、開啟gpu加速指令碼設定willchange,3dtransform製作動畫
web前端優化
盡量避免使用eval函式 多了一步解析的步驟 function testnoeval var endtime new date console.log 耗時1 endtime starttime ms function testeval var endtime new date console.lo...
web前端優化
做為乙個好的優秀前端,不僅能夠寫出優雅的 也要更加關注於效能性的問題,但由於我們在專案過程中可能會考慮到一些成本性的問題,不可能讓我們的專案在效能方面面面俱到,但我們可以做到最為基本的做優化。我們可以從以下幾點進行優化 1.減少對伺服器方面的請求 我們使用外部檔案 css 和js css sprit...
web前端效能優化
01 減少http請求 使用css sprite 合併js css02 使用cdn 當頁面中有很多資源的時候可以從不同伺服器中讀取 設定長的expires時間將直接減少http請求 如果資源設定了expires頭為將來的某個時間,下次訪問時候瀏覽器 發現資源還沒有過期,會直接從快取中讀取,不會再次產...