CLS caused by Lazyloading
-
Hi there,
I am using Jetpack for image Lazy loading. Jetpack doesn’t provide any rules to exclude particular image to load lazy.
While checking core web vitals, I found that my homepage has CLS of over 2. To reduce this, I decided not to use any image at the beginning of homepage. After that, when I checked again for CLS, I found that there is still CLS of over 1 which was caused by the header logo which was larger than the width of logo i set. Thereafter I reduced logo resolution to exact width that i set from customizer.
After doing all these, There is still some sort of CLS which i think due to lazy loading logo.
I need two options:
1. Exclusion Rule for lazy loading logo (I will also ask to Jetpack support)
2. Need a Placeholder for my Logo which loads to fit the logo and doesn’t create CLS. (A Placeholder that generates to fit logo and lazyloading image setting will help us to use animated logo too.)
Template i am using – GeneratePress premiumThe page I need help with: [log in to see the link]
- The topic ‘CLS caused by Lazyloading’ is closed to new replies.
