pagespeed-insightsclscumulative-layout-shift

How to optimize CLS when simulated data differs greatly from real data

When running https://swisswebcams.ch/webcam/1354996226 on pagespeed.web.dev, the result for CLS (Mobile and Desktop) is 0. However, when looking at CLS values measured by CrUX, the values are 0,13 and 0,21.

How can I optimize this real world CLS when I don't even know how it can result? Is it possible that CrUX might have a bug?

Solution

  • You missed this important part of your PageSpeed Insights test:

    Toggle showing origin-level data is being viewed

    And if you click on the info icon you see what it means:

    Explanation that origin-level data is shown

    So the CrUX data you are seeing is not for that page, but for the whole origin.

    However, even if that were not the case, it's entirely possible for the lower Lighthouse section of the page to show zero CLS, and the CrUX data to show CLS. This typically implies post-load CLS that happen on scroll or interactions that aren't excluded for CLS.