Cumulative Layout Shift
Cumulative Layout Shift measures how much visible content moves position while the page is loading, without the visitor causing it. Unlike the timing metrics it has no unit. It is a score built from how much of the screen moved and how far it travelled.
Good
Under 0.1
Needs work
0.1 to 0.25
Poor
Over 0.25
Why it matters
This is the failure people feel most directly. You go to tap a link, an image finishes loading above it, the page reflows, and you tap an advert instead. Nothing about that is subtle. Layout shift is also the one Core Web Vital that keeps hurting after the page has technically loaded, because late arriving content can move things at any point.
How it is measured
Each shift is scored as the impact fraction, meaning the proportion of the viewport affected, multiplied by the distance fraction, meaning how far it moved relative to the viewport. Scores are grouped into session windows of at most five seconds, and the page is judged on its worst window. Shifts within 500 milliseconds of a user interaction are excluded, because content moving in response to a click is expected.
What makes it slow
Images without dimensions
If the browser does not know how tall an image will be, it reserves no space. Everything below sits in the wrong place until the image arrives and pushes it down. This is the most common cause by a wide margin.
Webfonts swapping in
A fallback font with different metrics renders first, then the webfont arrives and every line of text reflows. Long paragraphs can move substantially.
Ads, embeds and iframes
Third party content that arrives late and sizes itself will push whatever is beneath it. Ad slots that expand from zero height are especially damaging.
Content injected above existing content
Cookie banners, promotional bars and notification strips inserted at the top of the document move the entire page down.
Animating layout properties
Transitioning width, height, top or margin causes the browser to lay out again on every frame, and each of those can register as a shift. Transform and opacity do not.
How to improve it
Ordered roughly by return on effort. The quick wins are usually worth doing first even when the deeper problem is elsewhere.
Set width and height on every image and video
Quick winModern browsers derive an aspect ratio from the attributes and reserve the correct space before the file arrives. This is a two attribute change that resolves most layout shift on most sites.
Reserve space for anything that loads late
Quick winGive ad slots, embeds and dynamic banners a fixed minimum height matching what will eventually appear. Empty reserved space is far less disruptive than a sudden expansion.
Use transform for animation
Quick winAnimating transform and opacity runs on the compositor without triggering layout, so it neither shifts content nor registers against the metric.
Control the font swap
ModeratePreload the fonts used above the fold and use font-display: optional, or tune the fallback with size-adjust and ascent-override so the metrics match and the swap causes no reflow.
Render banners in place rather than inserting them
ModerateIf a cookie notice must appear, render it in the initial HTML or overlay it rather than injecting it above the content once JavaScript runs.
How Pulse reports this
Because the entire meaningful range of CLS runs from 0 to about 0.25, Pulse normalises its threshold meter against those boundaries rather than against the value, so a score of 0.04 is as readable as an LCP of 4 seconds. The report also counts images rendering without declared dimensions, which is usually where the shift is coming from.
Common questions
What is a good CLS score?
Under 0.1 is good, 0.1 to 0.25 needs improvement, and above 0.25 is poor. CLS has no unit, it is a ratio of how much of the screen moved and how far.
Why is my lab CLS lower than my field CLS?
A lab run loads the page once, in a fixed viewport, and stops. Real visitors scroll, which triggers lazy loaded content, and they stay long enough for late shifts to accumulate. Lab CLS is usually optimistic.
Do shifts after a click count?
Shifts within 500 milliseconds of a user interaction are excluded, because content moving in response to a deliberate action is expected rather than disruptive.
Related metrics
Measure CLS on your own page
An audit runs in a real Chromium browser and reports CLS alongside every other metric, with the measured saving behind each recommendation.