什么是 DNS Prefetch ?
DNS Prefetch 是一种 DNS 预解析技术。当你浏览网页时，浏览器会在加载网页时对网页中的域名进行解析缓存，这样在你单击当前网页中的连接时就无需进行 DNS 的解析，减少用户等待时间，提高用户体验。
目前每次DNS解析，通常在200ms以下。针对DNS解析耗时问题，一些浏览器通过DNS Prefetch 来提高访问的流畅性。
设置方式
如果要浏览器端对特定的域名进行解析，通过以下两种方式实现：
1、通过 link 标签实现，例如：< link rel="dns-prefetch" href="http://api.twitter.com" />
2、通过 meta 标签实现，例如：< meta http-equiv="x-dns-prefetch-control" content="on" />
3、通过设置 Http header 的 x-dns-prefetch-control 属性为 on 进行控制。
这段代码应尽量写在网页的前部，起到减少dns请求的功能。
浏览器支持
- Firefox: 3.5+
- Chrome: Supported
- Safari 5+
- IE: 9
关于google chrome 中 DNS Prefetch
详细资料可参见： http://dev.chromium.org/developers/design-documents/dns-prefetching
在chrome 中可通过在地址栏中输入 about:histograms/DNS.PrefetchFoundName 和 about:dns 来查看当前浏览器的预解析数据。
参考资料
https://github.com/h5bp/html5-boilerplate/wiki/DNS-Prefetching
相关推荐
详解HTML标签属性link rel="dns-prefetch"是什么意思? DNS Prefetch有什么用处?
然而，需要注意的是，过度使用DNS Prefetch可能导致不必要的DNS查询，增加网络流量，甚至可能对某些浏览器（如Chrome和Firefox 3.5）的性能产生负面影响，因为这些浏览器已经内置了DNS解析优化。因此，谨慎使用DNS ...
DNS预请求，全称为DNS Prefetch，是一种前端优化技术，旨在提升单一页面应用程序（SPA）的首屏渲染性能和整体加载速度。它通过预先解析页面中可能会用到但尚未加载的域名，从而减少了用户实际访问资源时的DNS解析...
HTML5的<link rel="dns-prefetch"标签是干什么用的
DNS Prefetch可以预先解析即将访问的域名，预连接则是在用户请求内容之前建立TCP连接，这样在实际请求媒体内容时，由于网络连接已经准备就绪，可以显著减少延迟。 再者，自适应码率视频流技术可以根据用户的网络...
例如，通过开启DNS Prefetch开关，当用户访问H5页面超过一定间隔时间，或者配置文件发生变化时，自动触发DNS刷新。 此外，使用TCP长连接、代理服务器、专线优化等方式，可以减少网络通信的开销，提高数据传输的安全...
3. 前端性能优化的实践方向：针对每个步骤提出了可能的性能优化方向，如减少DNS解析次数、利用浏览器DNS缓存和DNS Prefetch，以及使用长连接和预连接等。 综上所述，本文件提到了前端性能优化的重要性和实践方法，...
通常，我们为了减少DNS的查询时间，我们可以使用dns prefetch为该页面中链接的做解析，提升页面的加载速度。类似的，我们可以在鼠标滑到链接上到点击的时间间隙去加载这个页面，通常这个间隙有几百毫秒，利用...
此外，除了`prefetch`，还有DNS预解析(`dns-prefetch`)，它用于提前解析页面中引用的域名，减少DNS查找时间。例如： ```html <link rel="dns-prefetch" href="http://example.com"> ``` 这样在用户实际请求资源...
3. **资源提示（Resource Hints）**：Turbo使用DNS Prefetch、Prefetch和Prerender等资源提示技术，优化网络请求，加快页面元素的加载速度。 4. **智能图片加载（Smart Image Loading）**：自动根据用户的设备和...
<link rel="dns-prefetch" href="https://assets-cdn.github.com"> <link rel="dns-prefetch" href="https://avatars0.githubusercontent.com"> <link rel="dns-prefetch" href=...
这是一种古老的技术-DNS隧道本身可以追溯到90年代， 在2016年写过关于使用dns-prefetch的信息，但据我所知，browsertunnel是第一个开放源代码，可用于生产的客户端展示其用途。 由于dns-prefetch不会将任何数据返回...
link rel="dns-prefetch" href="//qq.com"> <link rel="preconnect" href="//qq.com" crossorigin> <link rel="dns-prefetch" href="//baidu.com"> <link rel="preconnect" href="//baidu....
面试官可能通过具体问题来考察面试者是否了解现代浏览器的页面加载优化策略，包括但不限于`defer`、`async`、`preload`、`prefetch`、`dns-prefetch`和`preconnect`。 除了这些知识点，文档还强调了现代前端工程师...
首先，DNS-prefetch配置是提升页面加载速度的一个手段。在`layout/head-common.html`中添加`<link rel="dns-prefetch">`标签可以预解析DNS，使得浏览器在实际请求资源前就完成DNS解析，从而减少页面加载的时间。例子...
* `<link rel="dns-prefetch" href="//s1.bdstatic.com/">`：使用DNS预解析技术，预解析指定域名的DNS记录，以提高页面加载速度。 * `<link rel="dns-prefetch" href="//t1.baidu.com/">`：预解析腾讯云的DNS记录，...
开发者可以通过在HTML中添加`<link rel="dns-prefetch" href="//HOSTNAME.com">`标签，或者利用HTTP头`X-DNS-Prefetch-Control`来引导浏览器进行DNS预解析，从而进一步加速页面加载。 此外，CDN的合理部署也是提升...