<link rel="dns-prefetch">
The dns-prefetch keyword for the rel attribute of the <link> element is a hint to browsers that the user is likely to need resources from the target resource's origin, and therefore the browser can likely improve the user experience by preemptively performing DNS resolution for that origin.
See Using dns-prefetch for more details.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 46 | 79 | 127 | 5 | 46 | 26 | |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 3 item(s)
Limitation
- This browser only partially implements this feature
Removed
- This feature was removed in a later browser version (127)
Implementation note
- Only HTTP pages were supported.
Syntax
HTML
<link rel="dns-prefetch" href="https://api.example.com">
<link rel="dns-prefetch" href="https://analytics.example.com">Live demo
DNS prefetch purpose
Show how DNS prefetch resolves a hostname before the full request begins.
PreviewFullscreen
DNS prefetch vs preconnect
Contrast hostname lookup with the fuller connection warm-up of preconnect.
PreviewFullscreen
Use cases
-
Control document behavior
Use <link rel="dns-prefetch"> to influence loading, metadata, or script behavior at the document level.
-
Tune performance strategy
Apply <link rel="dns-prefetch"> when earlier resource hints or document settings improve startup or runtime behavior.
Cautions
- Test <link rel="dns-prefetch"> in your target browsers and input environments before depending on it as a primary behavior.
- Provide a fallback path or acceptable degradation strategy when support is still limited.
Accessibility
- Make sure <link rel="dns-prefetch"> supports the intended task without making the page harder to perceive, understand, or operate.