Improving Cumulative Layout Shift Problems

Joined
Apr 23, 2019
Messages
214
Likes
168
Degree
1
I found out what was causing my CLS to be bad.
Apparently, it's because of my logo.

For my logo, I use a PNG with the dimensions 640x280.
Size: 15.0KB.
Doing my speed tests, I got a message saying that I should add explicit dimensions for my images.
So I added this:
b26d1df1e92bb986eabdb7a7dbdd221e.png

(I tried it with and without "px").
This resolved the warnings.

However, now that I was diving into the CLS problem, I noticed that when I remove my logo, I get a perfect CLS score.

I also got a message on some speed test websites that images should be hosted on a subdomain, but they were only complaining about my logo. So I placed it on images.mydomain.com.

Clearly, I did something wrong regarding my logo, but I have no idea what. Any help would be greatly appreciated.

My theme is BuSo lightning, but I think my screenshot gave that away already :smile:

I noticed my thread got moved. Apologies, I wanted to post it in the "no dev question is stupid" thread, but I must have made a mistake in my tabs. Here is fine tho!
 
I moved your post, it seemed to have landed in the wrong thread. If there's a correct one, let me know and I can put it there. (I see you posted again about this before I did!)

So yeah, you figured out part of the CLS issues, which is if an image doesn't have an explicit inline size listed, then you get shifting when it finally loads. With the inline sizes, that space is already partitioned out on the screen and no movement occurs. The image just fills that space.

You do not need to have "px" within those quotations. height="640" width="280" is the correct method. This SHOULD resolve any warnings related to the logo. The only other thing I can think of is the negative bottom-margin that might cause it. If you want to PM me the site I can look at it, otherwise I'll need to add a logo to the demo as I don't have any other installation live at the moment.

But no, you don't need to move your images to a subdomain. I don't know if they're getting at using a CDN or what, but that has nothing to do with CLS issues or speed at all really, maybe other than sharding the resource demand off to another server, which a subdomain doesn't necessarily solve.
 
Back