CLS issue - WooCommerce

Hi there,

When the page loads the browser is not reserving any space for the product images.
Which is very odd, as the HTML for the images has the necessary width and height attributes which is what the browser requires to preserve the space.

It may be a case that the browser cannot deal with the huge DOM size and file payload being caused by the page loading 150+ (?) products on the page.

Try loading maybe 12 ? And see if the issue persists.

Hi David,

Thanks for your prompt reply.
I have set the limit to maximum 6 products per category. But the CLS error is still available.

The URL can be found in the private section.

If I change the limit to 1 or 2 products per category this error indeed get's resolved.

Regards,
Luuk

Resolved

I was just replying.... lol
What was the issue ?

Hi David,

No problem.
The issue with the CLS error is still available when you list a few products on a category page. Only if you limit to 1/2 products per category the CLS error get resolved.

Maybe this also has something to do with my staging environment? I will first move to a production server and limit the number of products per category page.

Regards,
Luuk

Yeah - it looks performance related. As the HTML required to render the space for them is correct.
Let us know when you get the site into a production server

Hi David,

I will do, thank you

Best Regards,
Luuk

You're welcome - best regards too!!