DNS预解析

 诞生背景

Dns请求虽然占用了很少的带宽,但会有很高的延迟,由其以移动网络会更加明显。通过dns预解析技术可以很好的降低延迟

 

在firefox上使用dns-prefetch,dns预解析是与页面加载是并行处理的,且不用影响到页面加载的性能.

 

在以图片为主移动网站被访问时,在使用DNS预解析的情意中下,页面加载时间可以提升%5个点

 

 

一、什么是dns-prefetch?

 

 

DNS Prefetch 是一种 DNS 预解析技术。当你浏览网页时,浏览器会在加载网页时对网页中的域名进行解析缓存,这样在你单击当前网页中的连接时就无需进行 DNS 的解析,减少用户等待时间,提高用户体验。

目前每次DNS解析,通常在200ms以下。针对DNS解析耗时问题,一些浏览器通过DNS Prefetch 来提高访问的流畅性。

 

 

二、如何设置dns-prefetch?

 

DNS Prefetch 应该尽量的放在网页的前面,推荐放在 <meta charset=”UTF-8″> 后面。具体使用方法如下:

 

1

 

2

 

3

 

4

 

<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”>

 

<link rel=”dns-prefetch” href=”http://renpengpeng.com” />

<!–如果不确定是http还是https连接的话建议如下写法 –>

<link rel=”dns-prefetch” href=”//renpengpeng.com” />

 

 

三、DNS Prefetching预解析实现原理与注意事项

 

1.<meta>信息告诉浏览器,当前页面要做DNS预解析;

 

<meta http-equiv=”x-dns-prefetch-control” content=”on” />

2.</head>使用<link>标签来强制对DNS预解析;

 

<link rel=”dns-prefetch” href=”http://bdimg.share.baidu.com” />

3.dns-prefetch需慎用,多页面重复DNS预解析会增加重复DNS查询次数;

 

4.浏览器对网站第一次的域名DNS解析查找流程:

 

浏览器缓存 -> 系统缓存 -> 路由器缓存 -> ISP -> DNS缓存 -> 递归搜素

5.如果要禁止隐式的DNS Prefetch,可以使用以下标签

 

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

四、典型案例;

 

淘宝:

 

 

 

支付宝:

 

 

 

网易:

 

About the Author

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

You may also like these