? ? ? 1.減少http請求次數：CSS Sprites、JS、CSS源碼壓縮、圖片大小控制合適：網頁Gzip，CDN托管、data緩存、圖片服務器

? ? ? 2.前端模板 JS+數據，減少由于HTTP標簽導致的帶寬浪費，前端用變量保存Ajax請求結果，每次操作本地變量，不用請求，減少請求次數

? ? ? 3.用innerHTML代替DOM操作，減少DOM操作次數，優化javascript性能

? ? ? 4.當需要設置的樣式很多時設置className而不是直接操作style

? ? ? 5.少用全局變量、緩存DOM節點查找的結果。減少IO讀取操作

? ? ? 6.避免使用CSSExpression 又稱Dynamic properties

? ? ? 7.圖片預加載，將樣式放在頂部，將腳本放在底部加上時間戳

? ? ? 8.避免在頁面的主體布局中使用table，table要等其中的內容完全下載之后才會顯示出來，顯示div+css布局比較慢。對普通的網站有一個統一的思路，就是盡量向前端優化、減少數據庫操作、減少磁盤IO。向前端優化指的是，在不影響功能和體驗的情況下，能在瀏覽器執行的不要在服務端執行，能在緩存服務器上直接返回的不要到應用服務器，程序能直接取得的結果不要到外部取得，本機內取得的數據不要遠程取得，內存能取得不要去磁盤取，緩存有的不要去數據庫查詢。減少數據庫操作指數減少更新次數。減少磁盤IO指盡量不使用文件系統作為緩存、減少讀寫文件次數等。程序優化永遠要優化慢的部分，換語言是無法“優化”的

總結

以上是生活随笔為你收集整理的web前端性能优化的方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。