DNS预解析dns-prefetch是什么及怎么使用

最新推荐文章于 2021-04-03 17:59:53 发布

荷花微笑

最新推荐文章于 2021-04-03 17:59:53 发布

阅读量1.2w

点赞数 6

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/qq_35432904/article/details/83988726

版权

SEO 专栏收录该内容

1 篇文章

订阅专栏

本文深入探讨了DNS预解析技术(DNSPrefetch)的工作原理及其在网页加载过程中的应用。DNS预解析能显著减少DNS查询延迟，提升用户体验，特别是在移动网络环境下。文章详细介绍了如何在网页中设置DNS预解析，并提供了注意事项，避免过度使用导致不必要的DNS查询。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

#诞生背景
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"> 后面。具体使用方法如下：

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

四、典型案例;

淘宝：

支付宝：

网易：

注意;

虽然使用 DNS Prefetch 能够加快页面的解析速度，但是也不能滥用，因为有开发者指出禁用DNS 预读取能节省每月100亿的DNS查询