Render-blocking Issue


#1

Hi,

I am wondering the best practice implemented by Wappler users when it comes to “Eliminate render-blocking resources: Resources are blocking the first paint of your page. Consider delivering critical JS/CSS inline and deferring all non-critical JS/styles.”

My question is specifically on the CSS/stylesheets.

Thank you. More power to Wappler.


#2

Have a look at https://r.je/eliminate-render-blocking-css-pagespeed

An Nginx box with Apache serving HTTP/2 will go a long way. Apache so that .htaccess can be used.


#3

Thank you. Will check the link.


#4

Thank you Ben. It worked like magic. Would it also work for an external CSS like for example: https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css

https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css; as=style; rel=preload


#5

This is really a great optimization Ben! I wasn’t aware that it is possible yet.

So full speed ahead! :slight_smile:


#6

Theoretically, it should not matter where the style sheet comes from so that I suggest that it would work for CDN’s a well.

Having said that, I believe that the relevance of a CDN is vastly diminished when using this technique. In other words, no need for a CDN.


#7

Thanks for the tip Ben - it added a few points to the speed score. The server concerned doesn’t run Nginx.