Chrome 103 is ready for beta testing It includes at least one major innovation, namely support for a technology called «EARLY HINTS». This should be able to contribute to a faster loading of web pages. We’ll get right back to how this works. But first a little bit about the problem you are going to solve.
When loading a web page in the browser, it is not done by sending a single data stream from the server to the client, i.e. the browser. Instead, this happens in a way reminiscent of the waterfall method, where the HTML document itself is downloaded first. This is then parsed and interpreted, and any resources such as images, fonts, and files are then downloaded using Javascript and style sets, either from the same server or from completely different servers. This will then be analyzed and interpreted, and it can be detected that more resources need to be downloaded.
Thus, quite a few requests such as downloading files may have to be made before the content on the web page becomes available to the browser.
This takes time.
It doesn’t just take time to transfer each of the files between the server and the browser. The server also needs time to decide what to actually send in response to. In the time that elapses between the browser sending the request and receiving the response from the server, the browser is often idle.
The most used solution today
Attempts have already been made to solve this in several ways, including before download (“previous download”). Once the browser receives the HTML document, the HTTP headers (including the . part) are interpreted
from an HTML document) first.using tags in
, like those shown below, a web developer can ask the browser to load resources that are known to be needed in advance to render the web page, even while the browser is translating the rest of the HTML document. When the resource is actually needed, it is downloaded and cached by the browser.<link rel="preload" href="https://news.google.com/__i/rss/rd/articles/main.js" as="script">Although this preload can have a significant impact, it cannot be customized until the web server has finished processing the HTML document request. This may take time, depending on all that needs to be done, for example, database search and authentication. In the meantime, the browser will still have to wait.
EARLY HINTS
A few years ago The technology we mentioned at the beginning of the article, an engineer at Fastly, Kazuho Oku, suggested any early hints.
The idea with these technologies is that the web server should be able to send a nearly instantaneous, but informal response to the browser, before the server starts thinking about the real response.
In the informal reply, which has an HTTP status code 103the web server can for example suggest which resources should be preloaded by the browser regardless of the response from the servers, for example like this:
HTTP/1.1 103 Early Hints
Origin-Trial: **your token**
Link: </style.css>; rel="preload"; as="style"
Link: <https://cdn.test>; rel="preconnect"Then the web servers will come up with the real response, once you know what it should be, for example like this:
HTTP/1.1 200 OK
Date: Fri, 27 May 2022 10:02:11 GMT
Content-Length: 1234
Content-Type: text/html; charset=utf-8
Link: </style.css>; rel="preload"; as="style"
Link: <https://cdn.test>; rel="preconnect"
<!doctype html>
…Depending on how quickly the server administration renders the real response, including any HTML document, such early tips as to the necessary resources can greatly help reduce the time the browser takes to render a web page.
Many browsers accept HTTP 103 status code, which can be tested over herebut that doesn’t mean they did anything with the content.
How about pushing the HTTP/2 server?
There is already an option in the HTTP/2 specification that has some of the same effect as the early hints. This is called server push and means that the web server can send both the HTML document and the necessary resources already after the first query from the browser, without the browser knowing at this point that it needs the other resources.
This can help the web page load faster, but since the server doesn’t know what resources the browser has already cached, it can also cause a lot of data to be transferred unnecessarily.
Write quickly on this page It is becoming increasingly clear that Server Push is not the right approach.
Google argued for To remove Server Push support in Chrome and Chromium, in part because it is less used and difficult to achieve effectively.
Currently alone
Google Chrome has had beta support for early hints since Chrome 95. It now appears that Chrome 103 functionality will be supported, though for now it is supported It has some limitations.
It is likely that other browsers based on the Chromium project will have similar support for early tips soon. Apparently Mozilla is in the process of building Early Hints support in Firefox. Apple and the Webkit . team However, no It comes with signs suggesting such plans for Safari.
For the early instructions to work, they must also be supported by both the web server software used and each site.
“Web specialist. Lifelong zombie maven. Coffee ninja. Hipster-friendly analyst.”
