前端優化 dns prefetch

2、dns請求雖然占用了很少的頻寬，但會有很高的延遲，尤其在移動端會更加明顯。

3、火狐瀏覽器上使用dns-prefetch，它是與頁面載入並行處理的，不會影響到頁面載入的效能

dns預解析，嘗試在請求資源之前解析網域名稱。可能是後面要載入的檔案，也可能是使用者將要開啟的鏈結

dns-prefetch可以幫助開發人員掩蓋dns解析延遲

html屬性，容錯性非常好。不支援的瀏覽器遇到dns-prefetch提示，**不會被中斷

如果需要瀏覽器對特定的網域名稱進行解析，可以在頁面中新增link標籤實現，例如：

<
link 
rel="dns-prefetch"
href
=""/>
<
link 
rel="dns-prefetch"
href
=""/>

1、dns-prefetch僅僅對跨域域上的dns查詢有效，因此避免使用dns-prefetch指向自己的站點或域。因為當瀏覽器執行到這行時，你設定的站點或域背後的ip已經被解析了，寫了也是白寫

2、如果該站點是通過https服務的，則此過程包括dns解析，建立tcp連線以及執行tls握手。可以將dns-prefetch與preconnect一起使用，dns-prefetch僅執行dns預解析，preconnect會建立與伺服器的連線，將二者結合起來可以進一步減少跨域請求的延遲

<
link 
rel="preconnect"
href
=""crossorigin
>
<
link 
rel="dns-prefetch"
href
="">

tip：如果頁面需要建立許多與第三方的連線，將它們預先連線會適得其反。preconnect最好僅使用在最關鍵的那個連線上，其他的連線只需使用dns-prefetch即可節省dns查詢的時間

3、dns-prefetch有個預設載入條件，網頁中使用a標籤href屬性帶的網域名稱，不需要在head標籤中加link手動設定的。但是a標籤的預設啟動在https不起作用，這時需要使用meta裡面http-equiv來強制啟動功能

2、京東