Google’s new Priority Hints API can pace up your web site

Recently, Google has published a post Encourage website developers and publishers to start using Priority Alert API, a new feature that helps optimize the loading of website resources by prioritizing the most important features for the user experience. This in turn would improve further Core Web Vitals (CWV).

In a test carried out by the Chrome browser team, an image with the attribute “Performance” was loaded as a background, which saved the browser 1.9 seconds of download time for this image.

Browsers have their own default resource prioritization. However, there are a few ways to tell the browser to reorder this resource download prioritization by downloading one image or script before another, or even pre-requesting a specific resource. This makes it easier to actually render the site.

This all seems purely technical, but think about the user experience.

Google’s Core Web Vitals is all about delivering the best experience to your audience. They prefer a website that loads faster and of course saves time. The same goes for Google.

What are priority notices?

Priority notices are a feature that allows the developer to change the order of priority in which website resources are requested and loaded for the user.

Imagine the web is like a road. On one side you are with your device and on the other side of the street is the shop (analogous to a website) that you want to visit. The street itself is your internet connection. The DNS is like the address of the shop you want to go to. TCP / IP is the transport mechanism you use to get to this place (on foot, by bike, by car, etc.) and HTTP is the language you use to communicate with this website.

When you load a website, the following happens: your browser identifies the address of the business (website) and sends a request to the server (a computer that stores the website) asking for permission to access that page. If the server agrees, the browser will combine the small chunks of information into a complete web page and display it to you.

So when a browser requests a resource (an image, script, etc.) it is given a priority that varies based on the type and location of the requested resource.

Each type has a different priority for the browser to request, download, and then render the resource.

With priority notices we can manipulate this priority in order to improve the user experience in our web applications.

The “Importance” attribute accepts one of three values:

  • High: The resource is rated as high priority and the user wants the browser to prioritize it as long as the browser’s usability settings do not prevent it.
  • Low: The feature is considered a low priority and the user wants the browser to despise it if the default usability settings allow it.
  • Auto: This is the default value, with which you have no preference and allow the browser to determine the appropriate priority.

More control over your pages

In the end, priority hints can have great uses User experiencebecause, as the website owner, you have more control over what loads on your pages first.

If you track user behavior through heat maps, widgets, click points, or other means, you can use this data to implement priority notices to improve the experience of your website.

For example, you can prioritize the loading of a specific image or button on your main page that you’ve seen users interact with most often. Or, on the contrary, you can downgrade unimportant scripts that may affect the performance of other more important aspects of your website for marketing reasons.

In addition, advice on priorities can also be of benefit to you SEO Efforts.

Since 2020, Google has been using Core Web Vitals metrics to evaluate a website’s performance.

If you get a high score on CWV, Google will see your page as user-friendly and consequently increase your chances of ranking high in the SERPs.

By using Priorities Hints, you and your IT team can actively make changes to the loading processes of your website in order to test versions that are positive for CWV metrics and for Loading speed.

But be aware: you are only hints and no instructions so the browser has the last word. However, Google says this behavior could change as the Chrome implementation matures. For the other browsers, we expect some progress in terms of this new feature as well.

Notes on using priorities

If you’re reading this article and have a little knowledge of HTML, you won’t need to contact a web developer to implement the new features. Otherwise, look for one. We know marketers have a full tech stack and need to learn new things and work with cross-teams more often.

The following is a technical approach to priority notices.

Basically, the priority notice is an HTML resource. By specifying an “Importance” attribute for a