A rel="dns-prefetch" attribute value on a <link> element attempts to resolve the domain of the linked source in advance.
The source can be a javascript file, stylesheet, CDN, JSON response, and more.
A rel="dns-prefetch" on a <link> element.
The browser will resolve the domain of the stylesheet in advance.
<head>
<link rel="dns-prefetch stylesheet"
href="https://css.static.com/mystyle.css" >
</head>
The rel attribute defines the relationship between the current page and the linked page or resource.
With rel="dns-prefetch" the browser performs a DNS resolution in advance.
A prefetch enhances load times by caching a resolved domain name from a third-party or different domain.
This is useful for different external resources, such as
Once a user actually requests these, they will be loaded faster.
Tip: Don't use rel="dns-prefetch" on links to your own domain. The IP of your domain is already known.
<link rel="dns-prefetch" href="url" />
Only one element accepts the dns-prefetch value on the rel attribute.
| Elements | Description | |
|---|---|---|
| <link> | Links a resource to the current page -- see example above |
Here is when rel support started for each browser:
 Chrome
|
6.0 | Sep 2010 |
 Firefox
|
4.0 | Mar 2011 |
 IE/Edge
|
12.0 | Jul 2015 |
 Opera
|
11.1 | Mar 2011 |
 Safari
|
5.0 | Jun 2010 |
