Early Hints
Used to return some response headers before final HTTP message.
What it means
The HTTP 103 Early Hints information status code is primarily intended to be used with the Link header to allow the user agent to start preloading resources while the server is still preparing a response.
When a server needs time to generate a response (e.g. executing complex database queries), it can send a 103 Early Hints response immediately, containing Link headers for critical CSS or JavaScript. The browser can then start fetching those assets while waiting for the main HTML document.
How it works
- 1The browser requests a web page.
- 2The server begins processing (e.g. fetching data from DB) but knows the page will need 'styles.css'.
- 3The server sends a 103 Early Hints response with 'Link: <styles.css>; rel=preload'.
- 4The browser receives the 103 and immediately starts downloading 'styles.css'.
- 5The server finishes processing and sends the 200 OK with the final HTML.
Why you're seeing this
- • The server is optimized to push hints to the browser to improve perceived load times.
How to fix it
- • If 103 Early Hints aren't working, check your CDN. Many edge networks (like older Cloudflare configs) strip 1xx responses. Also ensure you are running HTTP/2 or HTTP/3, as 103 is rarely supported over HTTP/1.1.
Framework Implementations
Node.js (http)
res.writeEarlyHints({
'link': ['</styles.css>; rel=preload; as=style']
});
// ... query DB ...
res.end(html);Cloudflare Workers
const response = await fetch(request); // Cloudflare automatically generates 103 Early Hints if you enable // 'Early Hints' in the dashboard and return Link headers in the 200 OK.
Real-Life Scenarios
Use 103 Early Hints to optimize Core Web Vitals (specifically LCP) on heavily dynamic websites where the server think-time is significant, but the required static assets are known upfront.
Optimizing Shopify/E-commerce Sites
While the server calculates personalized product recommendations, it sends a 103 hint to preload the main product image and CSS file.
Server-Side Rendered React Apps
While Next.js or Nuxt is rendering the HTML string on the server, a CDN like Cloudflare can send 103 Early Hints to preload the JavaScript bundles.
HTTP Transaction
1. Client Request
GET /dashboard HTTP/1.1 Host: app.example.com
2. Server Response
HTTP/1.1 103 Early Hints Link: </styles.css>; rel=preload; as=style Link: </main.js>; rel=preload; as=script (Server processes dashboard data...) HTTP/1.1 200 OK Content-Type: text/html <!DOCTYPE html>...
SEO Implications
Search engines generally ignore 103 Early Hints. However, because Early Hints significantly improve Largest Contentful Paint (LCP) and page speed metrics, they indirectly provide a massive boost to SEO rankings.