Render Blocking

Delete render-blocking resources

Compressor Speed performance

Delete render-blocking resources

The first paint of the page is often blocked by a list of URLs shown by SeoChecker report, so it is important to lower their influence: you could inline critical resources, delay non-critical resources and if there is something unused, remove it.

 

When does SeoChecker spot a render-blocking resource?

render blocking

There are several cases spotted by SeoChecker both in scripts and stylesheets.

For what concern the scripts, SeoChecker flags it if:

  • it is situated in the <head> of the document;
  • it doesn't have an async attribute;
  • it doesn't have a defer attribute.

The stylesheet is flagged if <link rel=”stylesheet”>:

  • doesn't have a disabled attribute: it forbids the browser to download the stylesheet.
  • doesn't have a media attribute coherent with the user's device (media=”all” is render-blocking).

Delete render-blocking resources

To identify render-blocking scripts you can check the Coverage tab in Chrome DevTools.

When you have identified them, you can proceed to delete them.

Render-blocking scripts

To delete render-blocking scripts, move the spotted code from the URL to an inline script tag in your HTML page; once the page has finished loading, it will be able to manage the functionality of the page's core.

Render-blocking stylesheets

There are two ways to delete render-blocking stylesheets:

  • inside a <style> block at the head of the HTML page, inline critical styles required for the first paint and use the preload link to load the rest of the styles in different moments;
  • you can split up the styles into various files managed by media query and then insert a media attribute to every stylesheet link. In this way, when the browser loads a page it will block the first paint to retrieve the stylesheets that correspond to the user's device. Later, we suggest minifying your CSS.

Share this Guide

Did you like it? Share it!

Share it!

Web tools for modern developers. Try these one!

Over 50 generators, builders and validators to improve your SEO and web performances

Home Back to top of the page