Site logo

Archived topic

Recurring CLS issue

5 replies · Started by Ryan on February 25, 2021

Viewing posts 1–6 of 6

Hi

I keep getting a recurring issue with CLS, I fixed it initially by removing the logo from the header.
However the issue has returned after a few months.

When I run the affected pages through the speed developer test, the lab data shows the CLS as fine. However it failed validation.

Also I am getting poor results on mobile speed, any suggestions on improving this.

Thanks

Hi there,

so the opening and closing of the Mobile Nav is triggering CLS ... but this should not be registed as its an Expected event ie. a User Clicked the Toggle... CLS only gets registered if a shift occurs if it's unexpected.

So there must be something else at play... can you disable the social share slide up icons temporarily so i can see if thats a problem?

Hi thanks for the quick response.
I have disabled the share slide.

Well thats weird.... still happening.
Can you enable the Mobile Header in Customizer > Layout > Header - so i can check what the difference is.

Hi

I have enabled mobile header.

Looking over the site i can't see what would cause a CLS failure - there are many tiny CLS events being triggered but those should not accumulate to a fail.

For the Mobile Menu you may want to enable the Off Canvas panel as its better suited Longer menus and will trigger less tiny CLS events:

https://docs.generatepress.com/article/off-canvas-panel-overview/

Optimization wise:

You have a few Image files that are fairly large in size - for example the Million Pound Betting and Trading image is over 120kb - and there are quite a few other images of a similar size. You should optimize them and better to use JPEG as it will afford you smaller files.

The Latest Posts page you have long excerpts... you may want to consider limiting these to a small text excerpt - its a lot less HTML and content to be loaded.

I am also seeing a YouTube Javascript file being loaded - if you're adding YouTube videos then a plugin like this will defer loading the scripts and video until the user clicks the video:

https://wordpress.org/plugins/wp-youtube-lyte/

This archived topic is closed to new replies.