DNS預讀取 dns-prefetch 提高頁面載入速度

DNS Prefetch，即DNS預獲取，是前端優化的一部分。通常來講，在前端優化中與 DNS 有關的有兩點： 一個是減小DNS的請求次數，另外一個就是進行DNS預獲取 。

DNS 做爲互聯網的基礎協議，其解析的速度彷佛很容易被網站優化人員忽視。如今大多數新瀏覽器已經針對DNS解析進行了優化，典型的一次DNS解析須要耗費 20-120 毫秒，減小DNS解析時間和次數是個很好的優化方式。DNS Prefetching 是讓具備此屬性的域名不須要用戶點擊連接就在後臺解析，而域名解析和內容載入是串行的網絡操做，因此這個方式能 減小用戶的等待時間，提高用戶體驗 。

默認狀況下瀏覽器會對頁面中和當前域名（正在瀏覽網頁的域名）不在同一個域的域名進行預獲取，而且緩存結果，這就是隱式的 DNS Prefetch。若是想對頁面中沒有出現的域進行預獲取，那麼就要使用顯示的 DNS Prefetch 了。

目前大多數瀏覽器已經支持此屬性，支持版本以下：

• – Safari: 5+
• – Chrome: All
• – Firefox: 3.5+
• – Opera: Unknown
• – IE: 9+ (called 「Pre-resolution」 on blogs.msdn.com)

其中 Chrome 和 Firefox 3.5+ 內置了 DNS Prefetching 技術並對DNS預解析作了相應優化設置。因此 即便不設置此屬性，Chrome 和 Firefox 3.5+ 也能自動在後臺進行預解析 。

目前不少大型站點也應用了這一優化，例如：

淘寶：

支付寶：

網易：

DNS Prefetch 應該儘可能的放在網頁的前面，推薦放在 <meta charset="UTF-8"> 後面。具體使用方法以下：

<meta http-equiv="x-dns-prefetch-control" content="on">
<link rel="dns-prefetch" href="//www.zhix.net">
<link rel="dns-prefetch" href="//api.share.zhix.net">
<link rel="dns-prefetch" href="//bdimg.share.zhix.net">

須要注意的是，雖然使用 DNS Prefetch 可以加快頁面的解析速度，可是也不能濫用，由於有開發者指出 禁用DNS 預讀取能節省每個月100億的DNS查詢 。

若是須要禁止隱式的 DNS Prefetch，可使用如下的標籤：

<meta http-equiv="x-dns-prefetch-control" content="off">