JavaScript and CSS in above-the-fold content

Tell me when you’re here and i can enable inline about an hour.

I am regularly, but only for short periods of time @kurogane so might not be ideal. As an alternative; can you copy/ paste the critical css you were using in a pastebin past or in a github gist and post the URL of that paste/ gist here?

I’m going to enable it if when you check is disable then check this critical css

https://0bin.net/paste/5gnhplzkWQho5fJY#zwap-RKQkwH5P+M00qzPvEQB+GI/RdAct+/pNMhe2uq

OK, you were absolutely right, this does break and it is due to the order of the deferred CSS and not due to the critical CSS!

The good news; I *think* this is already fixed on the development-version of AO, so it would be great if you could download it here and overwrite wp-content/plugins/autoptimize with the contents of autoptimize-master in the zip to confirm ??

I’ll try later, just curious why is enable critical css give me now Prioritize visible content ?

why is enable critical css give me now Prioritize visible content ?

because your critical CSS does not allow the above-the fold part of the page to be rendered in a manner that is close enough to the final rendering. in the google pagespeed insights results, you’ll see;

Only about 17% of the final above-the-fold content could be rendered with the full HTML response see screenshot show original.

and you can click on “see screenshot” and “show original”. this gives you an idea of what GPSI thinks is missing.

the problem you’re facing; some (a lot) of what google is missing, is rendered based on JS (the news-ticker & the image slider for example). the tools that generate critical CSS in general don’t see that, so you might have to amend the critical CSS by hand to ensure (at least) the divs that will hold the JS-based stuff have the right size. that _might_ appease GPSI.

I’ll try later

I see you did in the mean time and that it indeed works ??