All Category & Product Page Load Times now Poor on Google Search Console

All Category & Product Page Load Times now Poor on Google Search Console

cedarspring
Tourist
3 0 0

Something has happened in the past month or so - literally all of my Category & Product Pages now, according to Google, are Poor CLS. 

 

Screen Shot 2022-07-30 at 4.28.10 PM.png

 

I'm wondering what might have caused this but can't think of anything meaningful that happened for this to occur. 

 

Any help here would be amazing. Thanks

 

www.cedarspringrecreation.com

 

 

Replies 6 (6)

Cedcommerce
Shopify Partner
718 76 113

Hi @cedarspring

 

The issue is caused by the CLS (Cumulative Layout Shift), wherein the pages do not load properly.

This means that the page is taking time to load because of the shift.

The shift can be in any section, image, or div. Because of this, the shifting takes place when the page gets loaded.

The solution for this is to fix the height of images and sections which are causing this issue. When animation is applied to any section, then this also happens, or sometimes, because of responsiveness the issue is generated.

You have to fix the height of every section, image, and heading so that there will not be any shifting when the page gets initial loading.

 

Hope it helps. Let us know if any further help is required. 

 

All the best, 

Team CedCommerce

CedCommerce || Shopify Expert
- Let us know if our reply is helpful for you. Like it.
- Was your question answered? Mark it as an accepted solution.
- For further discussion contact: Email ID- apps@cedcommerce.com
- Whatsapp:- Join Here
cedarspring
Tourist
3 0 0

Thanks for the reply - I appreciate it a lot. 

 

How do I determine what is the culprit here. Is this for sure images or content I've loaded or is this an issue with the shopify theme I'm using? I kind of don't even know where to start with this issue. 

 

Thanks

subsecond
Shopify Partner
8 2 3

Hello, I tested the CLS on those pages from my end and they aren't amazing, but not nearly as bad as google is currently telling you.

subsecond_0-1659397756183.png

 

I would recommend waiting a week or two to see if the numbers go down. 

 

When the font for the announcement bar loads in there is a slight shift, and when the main logo loads there is another one, but its nothing terrible. (easily fixable if you want).

 

Thank you,

- Jones

 

PS those are some cool tents.

 

Subsecond: Helping stores build a better web experience for their customers.

Load the checkout page faster with Subsecond: Prefetch Checkout
Speed stats from real users with Subsecond: Speed Check
cedarspring
Tourist
3 0 0

The issue seems to have been going on for several weeks though so not sure if it's just a blip on the radar...

 

I'm actually wondering if this is caused by the chat function I installed (I swapped to a new chat function as part of our CRM rather than a standalone app we use previously)

 

Here's a screenshot just of the homepage loading right now on mobile - it's been a long time and the page is still loading & no chat icon has shown up as well....

 

 

subsecond
Shopify Partner
8 2 3

Ah, your right! I did a test on the chatbot and there is a 0.84 Layout Shift when the message shows up from the chatbot. 

subsecond_0-1659416696776.png

I messaged my web performance nerd friends as I haven't seen something like this before, I'll follow up with you. It turned out to be a really interesting case that I wouldn't have expected.

 

Thank you,

- Jones

Subsecond: Helping stores build a better web experience for their customers.

Load the checkout page faster with Subsecond: Prefetch Checkout
Speed stats from real users with Subsecond: Speed Check
subsecond
Shopify Partner
8 2 3

Following up with this. I would recommend reaching out to the chatbot provider with a bug report and see if they are able to fix it. The way that the chat is interacting with the screen would be very diffucult to fix externally. 

Or switch chat providers if the CLS is important to you.

Subsecond: Helping stores build a better web experience for their customers.

Load the checkout page faster with Subsecond: Prefetch Checkout
Speed stats from real users with Subsecond: Speed Check