Understanding the 103 Early Hints status code

When a user clicks a link or types in a URL, their browser sends a signal across the Internet to a server that’s sometimes continents away, asking for all the pieces of a puzzle that make up your website. This delay, often due to tasks like retrieving data from databases or connecting to CDNs to access original content, introduces a period of inactivity known as “server think-time.” During this phase, the browser remains idle, increasing the time it takes for content to appear on users’ screens.  

Enter the 103 (Early Hints) status code, an HTTP/2 protocol designed to address this waiting game. While it might not be as widely recognized as its more common counterparts, such as 200 (OK) or 404 (Not Found), its significance in application performance is undeniable.  

What is 103 Early Hints?  

Early Hints is a web standard that introduces a new HTTP status code, 103 Early Hints. This protocol innovation reshapes the dialogue between a client’s browser and the server to accelerate page load times. It’s like the server shouting a heads-up to the browser, signalling which resources it can start fetching right away, even before the full details are handed over. This jumpstarts the browser's activity, effectively taking advantage of the “server think-time” to load parts of a webpage pre-emptively.  

4 Benefits of Early Hints  

#1 - Faster page loads

103 Early Hints substantially reduce page load times by ensuring that vital resources, such as stylesheets, fonts, and scripts, are preloaded and connections are established in advance. This means that as soon as the browser requires these resources, they are immediately available, leading to faster and more efficient page loading.  

Here are visual comparisons that highlight the performance impact of implementing 103 Early Hints:  

Before Early Hints: There is more waiting time till the user-agent/browser receives the final answer.  

After Early Hints: Less wait is involved as the server has already shared indications of the essential resources.  

#2 - Enhanced Core Web Vitals

Early Hints contribute to significant improvements in metrics such as Largest Contentful Paint (LCP) and Cumulative Layout Shift (CLS), both of which are crucial for a good user experience. Additionally, with assets preloaded, the First Contentful Paint (FCP) metric — the time it takes for the user to see the first bit of content from the page — is also improved.  

#3 - CDN performance boost

Early Hints speed up connection to CDNs, allowing for faster content delivery. This significantly improves a website's perceived performance, as users can engage with the page more quickly and enjoy a superior browsing experience.

#4 - Future-proofing

Many major CDNs, HTTP server software providers, and browsers have already started supporting 103 Early Hints either as a prototype or as a part of their core feature set, indicating the direction of future web optimization trends. Adopting Early Hints now can provide a competitive edge and ensure that your site remains fast and user-friendly as technology advances.  

A few observations:  

• While a server can issue several 103 Early Hints, browsers are designed to acknowledge only the initial set of hints. Additionally, should a request result in a cross-origin redirection, the corresponding Early Hints must be disregarded, as they could lead to security issues or inconsistent behavior.  
  
• Support for 103 Early Hints is specific to ‘Pre-Connect’ and ‘Pre-Load’ processes.
  
• The success of Early Hints depends on where they come from. They must be dispatched from the base HTML document—typically the index.html. If the hints are dispatched from any other source, they will not yield performance gains. Moreover, compatibility is restricted to modern protocols; hints relayed via legacy protocols such as HTTP/1.1 or earlier will not be processed.  

Harness Catchpoint WebPageTest to visualize 103 Early Hints performance gains

Catchpoint WebPageTest (WPT) offers a visual tool to gauge how Early Hints enhance website performance. Instead of just focusing on numerical metrics, this tool allows users to see the actual loading process changes through a waterfall chart. This helps in tracking how Early Hints can optimize the performance of Content Delivery Networks (CDNs).  

From the waterfall chart below, it's evident that without Early Hints, there's significant "Server Think-Time," delaying the page load as the HTML is fetched. The Catchpoint WPT Waterfall graph displays this latency in the loading process before the implementation of Early Hints.  

After Early Hints is activated, the waterfall chart changes dramatically. It shows that as soon as the server issues the 103 HTTP Code, priority assets begin preloading simultaneously as the main document is retrieved. This preloading reduces the idle time and transforms how the browser renders the page, significantly impacting overall web performance.  

The Catchpoint WPT Waterfall can also identify specific assets that benefit from Early Hints. For instance, in the screenshot below, the server suggests preloading a font file (g.woff2) and an image (scm.svg). With these resources preloaded, the browser can render the page more quickly than without Early Hints, demonstrating the practical benefits of this approach.  

103 Early Hints is not just a protocol enhancement; it’s a necessary adaptation for a web that demands speed, efficiency, and a superior user experience. With Catchpoint WPT providing tangible insights into these performance gains, you’ll be more equipped to leverage this standard, ensuring your websites remain fast and efficient.  

Download our Website Experience solution brief and 5 Steps to Increase Website Performance Guide to learn how to make your website fast, reliable and resilient.