Options for render-blocking resources

It is important to note that external CSS files are render blocking (not just Webflow projects :wink:.

The only option you have to improve that on Webflow (hosted) is to minimize CSS: Remove any unnecessary CSS rules and reduce the file size of the CSS file by minifying it.

This is something you can do in the designer and project settings.

Off Webflow (you host and deploy), you could inline critical essential CSS in a style block (in the head) and then load the balance (non-critical) via the normal loading of the file.

If performance of your site is of an upmost concern of yours, feel free to reach out to me via a DM for professional services.

In https://webflow.com/ page, go to “/dashboard/sites/${yourWebsite}/code” > Custom Code > Add code at the end of the tag. In my case, I’ve added an async attribute to my script tag (my render-blocking resource was pointing to a js file).

This is the only thing stopping me from getting 100% on PageSpeed Insights. The Webflow Dev team should please fix this and the same for Google Fonts not having the ability to add the swap feature for font display, I had to upload the webfonts manually.

The only thing preventing me from reaching 100% on PageSpeed Insights is this. Please address this issue, as well as Google Fonts’ inability to add a swap tool for font display, as I had to manually upload the webfonts.