<zhead>
Link

dns-prefetch

Asks the browser to resolve an origin's hostname before a resource from that origin is requested.

Code examples

Good example
<link rel="dns-prefetch" href="//cdn.example.com">
Starts DNS resolution for a CDN origin the page expects to use.
Avoid this example
<link rel="dns-prefetch" href="#">
Points back to the current document and provides no useful external DNS hint.

Recommendations

  • 01
    Reserve it for likely origins
    Each hint can trigger network work. Add it only for external origins the page is likely to use soon.
  • 02
    Use preconnect when connection setup matters
    Preconnect can also cover TCP and TLS setup. Use dns-prefetch when DNS resolution alone is enough or as a lightweight fallback.
  • 03
    Account for privacy
    A DNS lookup can reveal interest in a hostname before the user requests a resource from it.

Related documentation