Site logo

Archived topic

Cumulative Layout Shift

10 replies · Started by Vera on March 11, 2021

Viewing posts 1–11 of 11

Hello,
I am working on improving The CLS for my website, but the following GP elements seem to be the biggest issue, particularly in desktop version:

1) div id="page" class="site grid-container container hfeed grid-parent" - WP SHOW POSTS
2)

- MENU
3)

I see that some things never copied in the previous message, so I am trying to add them here again:

2) MENU:

3) LOGO:

Ok, third time is a charm

2) MENU: div class="inside-navigation grid-container grid-parent"

3) LOGO: div class="site-logo"

I hope it will work now.

Hi there,

It seems like most of the elements flagged with CLS have image related issues.

Consider disabling lazyload for all the image and see if CLS improves.

Thanks, Elvin! However, I am not sure this is related exclusively to photos. My menu has no photos in it. Can you please be so kind to see it on my site and maybe you can help me find a solution?
Thanks a lot!
vera

Hi there,

can you disable the Critical CSS plugin you're using as its looks to be the cause of the issue as i can see several above the fold and theme styles being loaded after the page has been rendered.

Hi David,
thanks a lot for your reply! I don't have Critical CSS plugin installed on my website.
Any other idea?
Thanks
vera

I realized now, you are thinking of Speed Booster. That plugin has a part named Critical CSS. However, I've installed this plugin just recently, and the problem I have described above persist for a long time.
Any other idea?
Thanks a lot!
vera

I am still seeing the Critical CSS being added by that plugin.... it currently looks to be the main issue - if you can disable it then i check the site to see what other issues there are.

That's cache plugin, but it is not causing it. I just finished optimizing my website, and achieved pretty good results, and I prefer not to touch one thing that actually helps my site preform better on Core Web vitals. Critical CSS just carries former additional CSS that was reachable through Customize panel. Anyway, as I said, I had this issues before and it has nothing to do with Speed Booster or Critical CSS. Eg. critical CSS has nothing to do with the menu (there is no custom CSS code that does anything with the menu, yet I get a warning message about the menu).
Maybe, it can be something to do with my customized styling of certain boxes on my homepage (as I said Critical CSS is just the same code I used in Advanced CSS under Customize panel). Can you maybe check that? I never thought that additional CSS can cause this, but you never know.
Thanks, David!
Kind regards,
vera

Hi Vera,

Unfortunately the best way to check these things is to remove/disable them one by one so we can pinpoint the issue.

David is the master of these issues so I would recommend following his recommendation and disable the plugin to test.

Then if that doesn't solve the issue, then you can try removing the Additional CSS temporarily to see if that is the issue.

This archived topic is closed to new replies.