HTTP 103 Early Hints
Send preconnect and preload hints to the browser before the server has finished generating the HTML response.
Metrics
This technique can move up to 67% of LCP's share of the Lighthouse score.
This technique does not move TBT.
This technique does not move CLS.
This technique can move up to 67% of FCP's share of the Lighthouse score.
This technique can move up to 67% of SI's share of the Lighthouse score.
This technique can move up to 67% of TTFB's share of the Lighthouse score.
Overview
HTTP 103 Early Hints is a status code that allows the server to send Link response headers — preconnect and preload instructions — before the full HTML response is ready. The browser receives these hints while the server is still executing PHP, querying the database, or building the page, and immediately starts connecting to third-party origins or fetching critical assets. By the time the 200 response arrives, the DNS lookups, TCP handshakes, and font downloads are already underway or complete.
Impact grade, A+ to D: how much of the Lighthouse score this technique can move. Unaffected: TBT, CLS.
Performance Impact
LCP
100–400ms
LCP image preload fires before HTML is parsed
FCP
100–500ms
critical resources start loading during TTFB instead of after it
SI
100–400ms
fonts and CSS from external origins arrive sooner due to earlier preconnect
TTFB
server streams resource hints before the full HTML response is ready; browser starts fetching critical assets during server processing time
Risk: Low
browsers that do not support 103 ignore it; no fallback needed
How it works
01
Server sends 103 immediately, before processing completes
When the first byte of a request arrives, the server emits a
103 Early Hintsresponse containingLinkheaders. It then continues generating the full response. The browser processes the 103 headers immediately and acts on them — making TCP connections, starting TLS, downloading fonts — while waiting for the 200.02
Include preconnect hints for third-party origins
Add
Link: <https://fonts.gstatic.com>; rel=preconnectto the 103 response for every third-party origin the page needs — Google Fonts, analytics, CDN. This replaces the same<link rel="preconnect">tags in HTML but fires 200–600 ms earlier.03
Include preload hints for critical resources
Add
Link: </style.css>; rel=preload; as=styleto push the main stylesheet fetch earlier. For the LCP image:Link: </hero.webp>; rel=preload; as=image; fetchpriority=high.04
Configure at the server or CDN layer
Cloudflare Early Hints, LiteSpeed Server, H2O, and Nginx (with ngx_http_v2_module + custom config) all support 103. Cloudflare enables it automatically for sites on its network — check the ‘Early Hints’ toggle in Speed settings.
Limitations
- HTTP 103 requires HTTP/2 or HTTP/3 — the feature is unavailable over HTTP/1.1 connections.
- The hints in the 103 response are static and sent for every request to that URL — they cannot be dynamically tailored per user session or A/B test variant without custom server logic.
- The LCP image URL must be known at the routing layer (before PHP runs) to include it in the 103 hints. For pages where the LCP image varies by post or user, static hints are not possible without CDN-layer logic.
Common Mistakes
Including too many preload hints in the 103 response
Preloading 10+ resources fires all those fetches simultaneously at the start of the connection when bandwidth is most constrained. Limit 103 preloads to the 1–3 most critical resources — main CSS and the LCP image or font.
Relying on 103 hints instead of fixing high TTFB
103 Early Hints use idle TTFB time productively, but a 2-second TTFB still produces a slow page. 103 is a complement to, not a substitute for, server-side caching and database optimisation.
Need help applying this to your site?
Targeted fixes, not guesswork. We identify which techniques move the needle for your specific WordPress stack.
Start an Engagement