How to Fix "Avoid Chaining Critical Requests" On Blogger Website

Hey Bloggers, are you know that! Now, website or blog loading speed is an official ranking factor in Google? But fixing the technical problems in Blogger is a little tricky.

How to Fix "Avoid Chaining Critical Requests" On Blogger Website

So, in this article, I tell you how you can fix the “avoid chaining critical request” error in Lighthouse for your blogger website.

Before that let’s understand how this error occurred on the blog or website and what are the different ways you solve this problem.

What is critical request chaining?

Critical requests are network requests that are fetched by the browser with a high priority.

Critical requests are those network request that is important for page rendering and showing the above the fold content. It consists of web fonts, widgets, Images (in the viewport), and javascript used in the top portion of a website.

When a page or a script causes multiple resources to be downloaded with high priority, we speak of a chain of critical requests.

When we type our website URL in the page speed insight tool, it uses network priority as a proxy for identifying render-blocking critical resources.

The larger or heavier the Critical Request Chain becomes, the more influence the Critical Request Chain has on the loading time of the page according to lighthouse.

How to Fix "Avoid Chaining Critical Requests" On Blogger Website

Normally some heavy images and web fonts used in the website block the critical request to render and show the results. That’s why sometimes you got render-blocking resources error in page speed insight.

Best way to fix "Avoid Chaining Critical Requests" in lighthouse?

You can reduce the impact of critical requests in three ways in blogger website:

  1. You can Reduce the number of critical resources. Convert critical resources to non-critical resources by removing or defering them.
  2. Reduce the number of critical bytes. It may be obvious, but reducing the number of bytes of the critical path resources makes the critical resources download faster. For example: through gzip compression, javascript tree shaking, image optimization or font subsetting.
  3. Improve the download order of the critical path. Use resource hints such as preloading to skip resource discovery and to ensure that the critical resources are downloaded as quickly as possible.

How to Fix "Avoid Chaining Critical Requests" On Blogger

You can easily fix this critical request chaining by implementing a rel='preload' attribute in the fonts which are coming in the format woff2.

Just Copy the below code and replace it with your own font, .js and .css file URL and paste it just below the <head> tag of your theme.

<link as='font' crossorigin='' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/webfonts/fa-solid-900.woff2' rel='preload' type='font/woff2'/>

You can convert multiple font url in the same format and paste just below the <head> tag like below.

<link as='style' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css' rel='preload'/>

    <link as='script' href='https://www.blogger.com/static/v1/widgets/53698643-widgets.js' rel='preload'/>

    <link as='script' href='https://www.blogger.com/static/v1/widgets/2702847643-widgets.js' rel='preload'/>

    <link as='script' href='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js' rel='preload'/>

    <link as='script' href='https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.min.js' rel='preload'/>

    <link as='font' crossorigin='' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/webfonts/fa-solid-900.woff2' rel='preload' type='font/woff2'/>

But before proceeding further and changing anything on your Blogger Template, it is my recommended to take a backup of your Blogger Template.

So, that if anything goes wrong you can restore it quickly with the backup file.

You can also implement DNS prefetch in your Blogger theme to prioritize important resources and improve the page speed of your Blogger website.

If your theme has a built-in DNS prefetch option then you can skip this second step.

You can easily implement DNS prefetch just by pasting the code below the head tag. I have coved all about DNS prefetch and how to implement this on blogger here. 

Recommendation

Here is Some best way to reduce critical request chaining.

  • Preload your web fonts used on your website
  • Implement DNS prefetch
  • Reduce the number of javascript or defer it
  • Use properly optimized image at the top 
  • Try to avoid heavy widgets in the above section of the webpage. 

Conclusion

I hope this above tutorial will help you to fix the avoid chaining critical request error of your Blogger website.

I have shown you the first two ways to fix avoid chaining critical request problem in this article.

If you have any other doubts or problem regarding page speed in Blogger ask me in the comment box.

I recommend you, follow the steps given in the below article to speed up your website. 

0/Post a Comment/Comments

To be published, comments must be reviewed by the administrator.

⬅️ Previous Next ➡️