Resource hints are <link> tags that tell the browser to start network work before it knows it will need the result. dns-prefetch resolves a hostname. preconnect goes further and completes the whole connection, including the TLS handshake. prefetch downloads something for a navigation that has not happened yet. They differ from preload, which is not a hint about a future need but an instruction to fetch a resource this page definitely uses. None of them changes how large anything is. They move the setup cost out of the moment the browser discovers it needs the file.

Why a connection is worth pre-paying

Opening a connection to a new host is not one step. web.dev breaks it down: the DNS lookup “usually takes around 20–120 ms”, and the whole sequence “might involve up to three round trips—and more in unoptimized cases.”

That is the cost per host, and the number of hosts is rarely one. Across 457 audited sites the median page connects to twelve hosts it does not own, and a quarter of them pass twenty.

Sites ship hints, and still miss the connection that matters

Two of our filters read a page from opposite directions. One fires when the page already carries author-written hints, which our pipeline normalizes before adding its own. The other fires when the page loads a stylesheet, icon or image from an external origin that has no early connection set up for it. Snapshot of 2026-08-04:

PlatformSitesShips its own hintsMissing a connection to an origin it uses
Squarespace383635
Duda514840
Webflow34334
WordPress644236
WooCommerce573825
Elementor301812
Wix32831
Bitrix2879

Read the first two data columns together. Squarespace sites almost all ship resource hints and almost all still miss one, which is the combination worth naming: hints were written, and the origin actually on the critical path was not among them. Wix is the mirror image, hinting on a quarter of sites and missing a connection on nearly all of them. Webflow is the only column in the table where the hints on the page and the origins the page uses largely line up.

Volume varies more than the share does. On the 48 Duda sites carrying hints there were 640 of them, about thirteen per page, which is well past the point where the list is a decision rather than a default.

More is not better, and this is the failure mode

Every preconnect holds a connection open, and web.dev is explicit about the cost: “Unnecessary preconnecting can delay other important resources, so limit the number of preconnected domains.” The reason it is not free: “the browser closes any connection that isn’t used within 10 seconds”, so a hint to a host the page never reaches has spent bandwidth and sockets on nothing.

This is why a long hint list and a good hint list are different things, and why our own pipeline caps how many preconnects it will add to a page at four, then removes the ones the finished page turned out not to use.

Which hint to use

  • preconnect for the small number of origins on the critical path, typically a font host or the image CDN serving the LCP element. Costs a full handshake, so keep the list short.
  • dns-prefetch for origins you will reach later or only sometimes. It resolves the name and stops, which is cheap enough to be worth spending on a maybe.
  • prefetch for a resource belonging to the next page, not this one.
  • preload when the browser cannot discover the resource by reading the HTML, most often a font or a CSS background image. That case belongs to the preload scanner.
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="dns-prefetch" href="//analytics.example.com">

The crossorigin attribute on a font preconnect is not optional. Fonts are fetched in anonymous mode, and a preconnect without it opens a connection the font request will not reuse.

What WebSpeed does with them

It rewrites the list rather than extending it. Author preconnect hints are downgraded to dns-prefetch, author preload tags are dropped, and the page is then analysed for the origins it genuinely loads from, with up to four preconnects added for those. A final pass removes the hints the assembled page did not use. Origins behind links the page does not fetch, such as canonical, hreflang or a social profile, are excluded, because a connection opened for them is one of the dangling ones the browser will close unused.