Avoid chaining critical requests

What is a critical request chain?

A critical request chain is a sequence of requests that depend on each other, and are essential for page rendering. It is determined by the Critical Rendering Path, which establishes the order the requests are parsed and executed in.

To be more specific, these requests are all the resources that your website needs to work and files that other files need to work (here is the chain). For example, all the CSS and JavaScript that is added to your site will be downloaded in the same order in which they appear in your HTML, unless you specify another way (deferring, delaying).

Here, a link of a chain is a resource - CSS, JavaScript, external HTML etc.

You may see something like this if you use Google PageSpeed insights:

How does “avoid chaining critical requests” impact performance?

The impact over your site will depend on the length of the chains and the size of the resource that it is being downloaded in each link of the chain. This means that the greater the length of the chains and the larger the download sizes, the more significant the impact on page load performance.

Having very long chains or large chain links can make your site have a much slower loading time.

What can I do to avoid chaining critical requests on my page?

A critical request chain can be avoided by deferring or delaying the execution / parsing of some resources that are not critical for the visualization of the main viewport of the page. The goal is to prioritize only those resources necessary for the initial display, and load the others later.

Deferring delaying files like CSS, JavaScript, images, external HTML and other resources, even combining CSS / JavaScript files into one to reduce the length of the chain and preloading some critical resources can help.

How does WP Rocket help with Avoid chaining critical requests?

There are a lot of things that WP Rocket can do for your website to reduce the impact of this, for example:

  • Combine CSS Files and Combine JavaScript files.
    This can reduce the length of the chain combining all the files into one.
  • Load JavaScript deferred, Delay JavaScript execution and Optimize CSS Delivery.
    This can help so that certain resources that are not critical are recognized as non-critical resources, therefore the browser will be able to download all these resources with a better order and priority reducing the impact.
  • Preload Fonts.
    This can speed up the critical resource execution, saving valuable time during the page loading process.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.