Maybe you’ve already heard people talking about Early Hint? Or perhaps the HTTP 103 code? This feature, which is currently being standardized by the W3C, can be used to preload page resources even before receiving the first byte of content. Unfortunately, currently, HTTP 103 is very rarely used by browsers, despite the benefits it offers in terms of loading speed. To address this, our technical team has developed an optimization that allows our customers to preload a non-cacheable page’s resources – we’d like to introduce you to Early Hint!
Early Hint preloads resources before the page content
All HTML pages contain links to static external resources that need to be extracted before they can be used. Making these links available to the browser as early as possible helps to minimize perceived latency.
It’s possible to use the “Link” header to carry these links in the HTTP response header.
The aim of Early Hint is to use the time when the origin response is being optimized to send “Link” headers to the browser so it can preload these static resources.
How does it work? When the headers are received from the origin server, “Link” headers – which have been computed and cached beforehand – are added. This allows the browser to preload these resources without having to wait for page content.
This optimization is a first step for Fasterize. Our ultimate objective is to send “Link” headers without even waiting for a response from the origin server.
What savings does Early Hint offer?
This Fasterize feature allows our engine to save a few hundred more precious milliseconds when loading a web page.
Essentially, thanks to Early Hint, resources can be preloaded alongside our engine’s optimization processes. Let’s take an example. Here’s a website without Early Hint:
This diagram shows that without Early Hint, the browser waits until all page data is received before loading the assets. In this case, this takes around 350ms.
And here’s the same website with the Early Hint feature enabled:
This second diagram shows that when Early Hint is enabled, the browser starts loading the assets as soon as it receives the headers and before it receives the entire HTML code for the page.
It’s clear that with Early Hint, resources start to be loaded several hundred milliseconds earlier.
How to set up the Early Hint optimization on your Fasterize platform
If you want to test it out to see what impact it has on your website, the best thing to do would be to approach your dedicated Customer Success Engineer or contact our support team.
How can you find out if this optimization is for you?
It’s simple! Do you have a non-cacheable page? Then Early Hint could benefit you. Your Customer Success Engineer will help you to set it up.
EARLY HINT IN YOUR WEBPERF TOOLBOX
As with all of our optimizations, we’ve worked to make Early Hint easy to apply to the pages and resources of your choosing.
In the Early Hint settings, you can:
- enable/disable Early Hint
- whitelist/blacklist the pages on which you want (or don’t want) to apply Early Hint
- enable Early Hint by resource type: image, CSS, font or JS
Early Hint is the perfect addition to the existing features and tools at your disposal to optimize dynamic pages!
Discover all of our features to reduce your loading times!