Cumulative Layout Shift measures unexpected visual movement during a page’s lifecycle using session windows and excluding shifts within 500 ms of qualifying user input.
Find unexpected movement
CLS does not mean every intentional motion is excluded. The metric excludes shifts within 500 milliseconds of a qualifying user input; delayed response to an input can still count. It uses session windows, so inspect the actual layout-shift entries rather than assuming a single animation explains the score.
How to inspect it
Use field data to learn whether a problem affects real visitors, then reproduce it in a performance trace with layout-shift markers. Inspect the element that moved and the element that caused the move; they may be different. Test cold and repeat visits because cached fonts and assets can hide a first-load problem.
How to implement or improve it
Reserve width and height or aspect ratio for media, allocate a fixed or bounded region for dynamic modules, and avoid injecting content above an already visible control. If a font changes metrics, select a compatible fallback or tune the font-loading strategy. Recheck keyboard focus and responsive breakpoints after every change.
Limits and common mistakes
Do not suppress legitimate user-triggered transitions merely to improve a metric. The objective is predictable layout before and during reading, not a synthetic score detached from the interface.
A focused CLS check has three passes: cold load, interaction state and responsive breakpoint. In a cold load trace, note which element moved and which late resource caused it. In an interaction state, distinguish a user-initiated expansion from an unexpected insertion above the active control. At a breakpoint, test whether an image, ad slot or consent banner loses its reserved geometry. A concrete repair is to provide width and height or an aspect ratio for the image container before the image bytes arrive, then verify that the grid, focus order and scroll position remain stable on a narrow screen. Do not reserve arbitrary excessive space merely to lower the metric; the page must still feel intentional.