Web前端效能優化

2021-09-01 16:02:30 字數 963 閱讀 9273

1.1 減少http請求

1.2 加快dns解析

1.3 設定http快取

1.4 資源合併(js,css)

1.5 資源前端壓縮

1.6 精靈(sprite)

1.7 data: url scheme

1.8 服務端壓縮gzip

1.9 懶載入

1.10 css頭部載入

1.11 js非同步載入

1.12 js按需載入

1.13 減少http重定向

1.14 優化dom結構

1.15 不失真壓縮

1.16 介面合併

2.1 多網域名稱資源伺服器

2.2 cdn

2.3 靜態資源快取伺服器

3.1 減少dom節點查詢(快取dom選擇器)

3.1.1 html collection

3.1.2 減少reflow(重排)

3.1.3 減少repaint(重繪)

3.2 避免使用eval和function

3.3 慎用with

3.4 減少作用域鏈查詢

3.5 資料訪問,利用區域性變數

3.6 字串拼接用陣列join

3.7 事件繫結多用委託

3.8 css選擇符(從右往左)

3.9 resize使用計時器繫結時間間隔

3.10 記憶體使用與釋放控制

3.11 scroll和resize等事件觸發採用函式節流(settimeout)

3.12 巧用快取

4.1 總是從id選擇器開始繼承

4.2 在class前使用tag

4.3 將jquery物件快取起來

4.4 掌握強大的鏈式操作

4.5 使用子查詢

4.6 對直接的dom操作進行限制

4.7 冒泡

4.8 消除無效查詢

4.9 推遲到 $(window).load

web前端效能優化

01 減少http請求 使用css sprite 合併js css02 使用cdn 當頁面中有很多資源的時候可以從不同伺服器中讀取 設定長的expires時間將直接減少http請求 如果資源設定了expires頭為將來的某個時間,下次訪問時候瀏覽器 發現資源還沒有過期,會直接從快取中讀取,不會再次產...

web前端效能優化

一 網路相關的一切,包括dns解析 http請求等等 二 web優化,就是前端頁面相關部分,也就是我們日常擼 能夠做到的一些 1 設定dns多級快取 瀏覽器快取,系統快取,路由器快取,ips伺服器快取,根網域名稱伺服器快取,頂級網域名稱伺服器快取,主網域名稱伺服器快取。2 dns負載均衡 dns重定...

前端web效能優化

使用cdn 進行dns預解析 每個請求都需建立連線消耗一定時間,請求數越多則網頁載入時長越長。我們可以將資源盡可能的合併從而減少請求 合併,使用sprites精靈圖 css 檔案合併 動態指令碼載入 defer html解析完成後才執行,按載入順序依次執行 async 載入完立即執行,和載入順序無關...