不能錯過的web前端效能優化總結

2021-09-11 14:36:20 字數 488 閱讀 9966

web前端效能優化主要分為以下幾個板塊:

優化指令碼優化

html優化

css優化

渲染優化

"x-dns-prefetch-control" content="on" />

複製**

"dns-prefetch" href="" />

複製**

示例

"x-ua-compatible" content="ie=edge,chrome=1">

"x-dns-prefetch-control" content="on" />

"dns-prefetch" href=""/>

"dns-prefetch" href="" />

複製**

注:dns-prefetch需慎用,多頁面重複dns預解析會增加重複dns查詢次數。

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 載入完立即執行,和載入順序無關...