reder-blocking resources

Hi,

For CSS file, you can try enable “load css asynchronous”

Best regards,

when I put load css async the cart page loads kinda rare, for an instant looks messy and then normal. so, if I load css async, how can I avoid that issue ?

Hi,

please check this page

Best regards,

It keeps happenig that issue, I have enable Generate Critical CSS and disable Generate Critical CSS in the Background, what can I do ?

The cart page loads but for a moment looks messy and then normal.

Hi,

did you purge all?

have you verified if CCSS rule is properly inserted into HTML code ?

in same page I provided , with title Critical CSS Not Loading

Best regards,

the messy page kinda disappeared, but the icons while loading are like a rectangle that has an X inside

any option to avoid that ?

@freddyee
> any option to avoid that ?

Yes, choose other theme that needs less CSS. More than 1 MB only for CSS is a killing theme! LiteSpeed Cache plugin can optimize loading behaviour, but cannot reduce so much CSS code.

what theme do you recommend for ecommerce ?

it keeps happening that issue in the cart page, and the style is in the html code

Hi,

I don’t have any particular suggested WooCommerce theme

if CCSS doesn’t work for you , it probably means our CCSS engine may not work well with your page , that’s something we are actively improving though.

but the icons while loading are like a rectangle that has an X inside

could you please provide a screenshot for how it looks like ?

and check in your browser’s dev tool , see if there is any bad request or error message show up

Best regards,

you can see there those icons that take a time to load and are like rectangles with an X inside : https://snipboard.io/aWfVwd.jpg

Hi,

I suspect this happens because CSS is rendered before font file is loaded.

try pre-load the font , and see if it helps

Best regards,

@freddyee

Sorry, if my words may hurt, but you want answers, right?

Your case is the worst case ever and gives the best example for everybody don’t do that! 5 MB to load only for static sources is too much!

Too much Javascripts from external hosts that blocks loading, parsing and rendering of the code from your own host. Kick off everything from external hosts, including the high number of font files from Google you don’t need anyway. This will cut in half the amount of data to load and will double the loading speed of your page, at least!

How to kick off the external javascripts ?