天天積累一點點,你會與別人不同哦

跟你們分享一個小知識點,本身也總結總結,fight 、fight 、fight !!!前端

前端優化系列之一:DNS預獲取 dns-prefetch 提高頁面載入速度git

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

DNS(Domain Name System,域名系統),萬維網上做爲域名和IP地址相互映射的一個分佈式數據庫,可以使用戶更方便的訪問互聯網,而不用去記住可以被機器直接讀取的IP數串。經過域名,最終獲得該域名對應的IP地址的過程叫作域名解析(或主機名解析)。DNS協議運行在UDP協議之上,使用端口號53。 ------引自《百度百科》github

DNS 請求須要的帶寬很是小,可是延遲卻有點高,這點在手機網絡上特別明顯。預讀取 DNS 能讓延遲明顯減小一些。
     而DNS Prefetching 是讓具備此屬性的域名不須要用戶點擊連接就在後臺解析,而域名解析和內容載入是串行的網絡操做,因此這個方式能    減小用戶的等待時間,提高用戶體驗。
  • 默認狀況下瀏覽器會對頁面中和當前域名(正在瀏覽網頁的域名)不在同一個域的域名進行預獲取,而且緩存結果,這就是隱式的 DNS
    Prefetch。若是想對頁面中沒有出現的域進行預獲取,那麼就要使用顯示的 DNS Prefetch 了。

例如京東:

圖片描述


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

<meta http-equiv="x-dns-prefetch-control" content="on">
 <link rel="dns-prefetch" href="https://github.com/wangruifangWEB">

注意:雖然使用 DNS Prefetch 可以加快頁面的解析速度,可是要視狀況而用哦,由於有人指出 禁用DNS 預讀取能節省每個月100億的DNS查詢 。瀏覽器

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

<meta http-equiv="x-dns-prefetch-control" content="off">
相關文章
相關標籤/搜索