[Resolved] CLS Issue on site

[Craig]

Hi, I switched to the GeneratePress theme about 2 months ago and so far have been really happy with it. My reason for switching was to speed up my site and make it much leaner than it previously was. I wanted to really score well in Google PageSpeed Insights as I feel that was hurting my site.

My scores on PSI has definitely gotten much better with GeneratePress, however, I’m still scoring Poor in the Core Web Vitals section of Google Search Console, saying CLS is poor for both Mobile and Desktop – Agg. CLS .37 for mobile, .71 for desktop.

I’ve searched the forums here as well as other places on the web, including my ad management service and feel I’ve done as much as I can with it. Would you be able to take a look at my site to see if there’s anything I can do to score a green for CLS?

My site is https://www.crazyfamilyadventure.com.

[Leo]

Hi there,

Can you disable all plugins except GP Premium for us to run the test first?

[Craig]

I can, but can we coordinate a time to do this? I think disabling the plugins will have a pretty big effect on my site so I’d like to minimize the interruption. I’m unavailable tomorrow (Wednesday 1/27/21), but am available pretty much any day after that. Let me know what works for you. Thanks!

[Leo]

Any chance you can just start a staging site?

Let me know 🙂

[Craig]

Not easily unfortunately. I can turn them off now if you’re still available?

[David]

Hi there,

i just ran a page speed test on the site, and although the origin data is expressing high CLS – the Lab Data is not it is showing really low and very acceptable values.

Looking at the site, the elements that are creating the very small CLS are all related to the Cookie Notice. Nothing there to be concerned about.

I think over time you should see the Origin Summmary / Field Data upto to match the Lab values. So all is good.

One thing i did notice is that all of your page HTML has a lazyload class attached to it …. never seen this before – doesn’t look like its causing an issue but just curious what plugin/function is doing that?

[Craig]

I’m currently using GDPR Cookie Consent Banner by Termly for the cookie consent bar. Do you have another option you’d recommend instead?

As for the lazy load html, I didn’t even know that was happening. I’m using both WP Rocket for my cache/optimizing plugin as well as EWWW Image Optimizer with the CDN image hosting option.

I will have to look to see which one of those is doing the lazy load of html as they both offer lazy load functionality.

[David]

For GDRP – i can’t suggest a better alternative. I wouldn’t be bother about the CSL its creating ,its absolutely tiny, and it will get lost in Googles field data over time.

Yeah i have never seen a lazyloader apply to all HTML… might be worth checking with WP Rocket 🙂

[Craig]

How did you find the lazy load being applied to html? I’m not seeing that anywhere?

[Elvin]

Hi there,

How did you find the lazy load being applied to html? I’m not seeing that anywhere?

We determine this by inspecting the site for any classes or attributes that indicate lazy loading.

I’ve also checked your site and I’ve found 90+ elements that have lazyloaded class being applied to it as shown here: https://share.getcloudapp.com/7Kupg2mz

This is most likely the same thing David noticed.

And that’s something added by WP Rocket. You can even see it directly being reference in one of the inline scripts added by the mentioned plugin here: https://share.getcloudapp.com/yAu6xoDr

[Craig]

Ok thanks! I’ll check into that with WP Rocket.

[Elvin]

No problem. 🙂

[Author]

Posts