What is front-end optimization of dns-prefetch: DNS pre-resolving improves page speed

Author：Eve Cole Update Time：2025-07-01 00:48:02

In web experience, we often encounter this situation, that is, when calling Baidu Alliance, Google Alliance and domain name files outside the domain name where the current web page is located, we will encounter a very serious request delay. So is there a way to solve this phenomenon of severe request delay? What is DNS Prefetch

DNS implements domain name-to-IP mapping. Accessing the site through a domain name requires DNS resolution for every request. Currently, each DNS resolution is usually below 200ms. In response to the time-consuming problem of DNS resolution, some browsers use DNS Prefetch to improve access fluency.

DNS Prefetch is a DNS pre-resolution technology. When browsing a web page, the browser will resolve and cache the domain names in the web page when loading the web page. This way, when clicking the connection in the current web page, there is no need to resolve DNS, reducing user waiting time and improving user experience.

Currently, browsers that support DNS Prefetch include Google Chrome and Firefox 3.5

If you want to parse a specific domain name on the browser side, you can add a link tag to the page to implement it. For example:

If you want to control whether the browser side pre-resolves the domain name, you can control it through the x-dns-prefetch-control attribute of the Http header.

Unfortunately, only Google Chrome and firefox3.5 support the tags above

Generally speaking, the reason for this delay is not the bandwidth or load of the other party’s website, so what exactly causes this situation. Zalan tried to speculate, assuming it was a problem with DNS, because DNS resolution speed is likely to be the biggest cause of resource delay. So Zaolan added the following code to the page header (used as DNS pre-parser):

The effect is very good (the test browser is IE8), and the loading of Baidu share buttons is significantly improved when opening other pages!

Let's briefly learn about dns-prefetch:

As the basic protocol of the Internet, DNS seems to be easily overlooked by website optimization personnel. Now most new browsers have been optimized for DNS resolution. A typical DNS resolution takes 20-120 milliseconds. Reducing the DNS resolution time and number is a good way to optimize. DNS Prefetching is a domain name with this attribute that does not require the user to click on the link to resolve in the background. Domain name resolution and content loading are serial network operations, so this method can reduce the user's waiting time and improve the user experience.

The browser's first domain name DNS resolution and search process for the website is:

Browser cache-System cache-Router cache-ISP DNS cache-Recursive search

Domain name DNS resolution search process

Chrome has built-in DNS Prefetching technology, and Firefox 3.5 also introduces this feature. Since Chrome and Firefox 3.5 themselves have optimized DNS pre-resolution accordingly, one of the adverse effects of setting DNS pre-resolution is that it may reduce the user experience of Google Chrome browser and Firefox Firefox 3.5 browser.

Preparse implementation:

1. Use meta information to inform the browser that the current page needs to be pre-parsed by DNS: <meta http-equiv=x-dns-prefetch-control content=on />

2. Use link tags in the page header to force pre-parse DNS: <link rel=dns-prefetch href=http://bdimg.share.baidu.com />

Note: dns-prefetch needs to be used with caution. Repeating DNS pre-resolving on multiple pages will increase the number of repeated DNS queries.

PS: DNS pre-resolution is mainly used for website front-end page optimization. Its role in SEO has not been verified yet, but as part of enhancing user experience rel=dns-prefetch may be worthy of discovery.