CSS Render blocking no longer working

There’s no requirements apart from WordPress >= 4.9 and PHP >= 5.6 Michael …

Re. Render-blocking CSS; do you have the “remove render-blocking CSS” option on with manual above-the-fold CSS or automatic critical CSS?

“Eliminate render-blocking CSS” is disabled on the old and the new server. If I enable it PageSpeed Insights no longer complains about render blocking, but then it complains about Cumulative Layout Shift and the speed score is even worse.

If I enable it PageSpeed Insights no longer complains about render blocking

that indeed is the only reliable way to ensure the CSS is not render-blocking.

but then it complains about Cumulative Layout Shift and the speed score is even worse

that implies you either have no or incorrect “above the fold CSS”, see the Autoptimize FAQ for info on how/ where to generate that (look for “inline & defer CSS”).

I found now another difference between the old and the new server that leads to a lower score. On the new server Autoptimize does not combine the CSS from the Enlighter – Customizable Syntax Highlighter plugin. On the old server the CSS is correctly combined. How is this possible? Both servers identical.

can you share the site’s URL Michael so I can have a look at the HTML source (likely tomorrow though, almost wrapping up for the day here)?

You can try this page: https://4sysops.com/archives/work-with-azure-management-groups-and-subscriptions-using-powershell/

I enabled CSS minification in W3 Total Cache and this solves the problem for now. So the Enlighter CSS is combined now and we get the same speed cores as before. I am unsure if this won’t cause other problems.

the reason is the file wp-content/cache/enlighterjs.min.css is in wp-content/cache directory which is excluded from CSS optimization by default, you can remove that exclusion from the CSS optimization exclusion field maybe?

I wonder why this isn’t a problem with the old server? The WordPress configuration is identical. The only difference between the old and the new server is the MySQL version and the Ubuntu version.

We currently have the old server running. You can see yourself that combining the Enlighter CSS works here.

If on the old site wp-content/cache was in the CSS optimization exclusion list and if the Enlighter CSS was also at wp-content/cache/enlighterjs.min.css, then it should be excluded there as well Michael.

I can’t say for sure what server (new or old) I’m seeing now, but in the HTML source I do see that file (and some others) not being aggregated;

Sorry I have been switching back and forth between the old and the new server to find the difference between the two. The Autoptimize configuration of both servers is identical. We created a backup with mysqldump and just imported it on the new server. wp-content/cache/ is in the exclusion list on both servers.

For the next couple of hours only the old server is running.

in that case, if the enlighter CSS file is loaded from wp-content/cache/enlighterjs.min.css on both servers, it _should_ be excluded.

I only excluded the JS. As you can see now, the the Enlighter CSS is combined properly on the old server without excluding it. It is really weird that a different hardware and a different database system can have an impact on such high level functions, but I have no other explanation.

My guess is that it has to do with timing. If some functions are processed faster or slower it can have an impact on a higher level.

Weird, as I still see it being excluded?

I see now that the CSS file appears in the code. However, PageSpeed Insights does not complain that it is render blocking:

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2F4sysops.com%2Farchives%2Fwork-with-azure-management-groups-and-subscriptions-using-powershell%2F

On the new server it does and it has a significant impact on the corresponding core web vitals score.

That’s down to the magic of the black box that is pagespeed insights, no idea what would cause those differences Michael.

My advice would be not to go down the rabbit-hole unless if you’re willing to look into “removing render-blocking CSS” because without that option (and correct “above the fold CSS” or alternatively using the “critical CSS” integration to avoid CLS) your CSS is render-blocking, even if GPSI doesn’t flag it.