Optimize Cumulative Layout Shift
When customers start monitoring Core Web Vitals and eventually optimizing it, we first give them a brief introduction. During this introduction, we like to show them how this choice will make their optimizations a lot more pleasant. Many websites come to us because they have a Cumulative Layout Shift (CLS) problem that they cannot place.
Limited availability
Layout instability is not Baseline because it does not work in some of the most widely-used browsers.
- Only supported in Chrome 84 and Edge 84
- Continue reading about layout instability
Register to RUMvision to see more resources and learn if your website visitors would already benefit from this feature today.
But with RUMvision, within minutes you'll have the insights you've been looking for all along. Check out the video below.
Debugging your CLS
In the video we show you how you can do it should you use RUMvision, this is then also a use-case we created based on customer compliments. With filters and the right Core Web Vitals data, you can see the following in RUMvision:
- On which template the CLS appears
- Which specific element causes a shift
- Whether it is a problem on each device (viewport)
With these insights, you no longer have to guess or spend a very long time debugging to spot your CLS problem. Once the problem is found, you can work on optimizing your Cumulative Layout Shift (CLS) using your knowledge or recommendations from us.
Why are these insights so valuable?
The important thing to know is that this data consists of only your visitors. So if a certain element indicates a high value then there have been users who have experienced a CLS. When you start debugging yourself you often base it on yourself, but in reality, you have thousands of visitors, each with their conditions (device, internet, viewport, are they unique or returning, etc.).
Every user has their own CLS experience
When we know that an element causes a shift for your real visitors, we can also see how much the CLS value is per user. For example, in the histogram above you can see that the majority have a CLS value of 0.4, but there are also better and worse experiences. Since you know it's a problem for the majority, you can decide to put it on your roadmap soon, so you'll start passing the Core Web Vitals again.
The takeaway of this use case
Very simple. If you want to save time and be sure you are going to optimize the CLS the right way, you need these insights. When you have optimized the CLS, you can also see within a few hours whether the improvement has had an effect, that way you don't have to wait 28 days for CrUX data from Google.
This way, our users have more time for other things and do not have to frustrate themselves with the CLS, which is generally a tricky metric to find and solve. So want to save time? Then be sure to get in touch, as we have dozens of other ways to make optimizing Core Web Vitals faster and more fun.
