Christian SchreiberWeb Performance Consulting Book a performance analysis

Cumulative Layout Shift How the value arises, what drives it on large platforms and how the layout stays stable

Cumulative Layout Shift measures how much visible content shifts without any action by the user. The metric has no unit: it combines the share of the affected area with the distance of the movement. Of the three Core Web Vitals, it is the one that can be fixed most reliably, because its causes are visible and can be attributed individually.

Threshold: 0.1 at the 75th percentileOwn data: as of August 2026

The CLS value combines shifted area with the distance of the movement

The browser observes which visible elements change their position between two rendered frames. Each such shift produces a score from two factors: the share of the viewport that is affected and the distance by which the content moves. The individual scores are added up in windows of at most five seconds, and the worst window of a visit counts.

Shifts within 500 milliseconds after an input are excluded, such as a drop-down menu or an opened accordion. A section that only loads later after the click does count. Everything that happens without any action by the user does count.

Layout shifts: five recurring causes

Consent banners and campaign components shift the layout on large platforms

The technical basics are usually in place: images carry their dimensions, the base layout is stable. The value then arises from what is added at the top, which means campaign components on homepages and the consent banner on all pages. That is why the homepage is often the page type with the worst value, even though it is technically the best maintained.

The countermeasure is organizational, not technical: a campaign component gets a fixed minimum height, and whoever adds it checks that height. Without this rule, the value returns after every campaign.

Fix CLS: measures in order of impact

  1. Height and width on every image, every video and every embed.
  2. Reserved space for everything that loads later, with a fixed minimum height per component.
  3. Place the consent banner over the content instead of shifting the content.
  4. Load fonts with immediately visible text and match the dimensions of the fallback font.
  5. Render personalized components on the server or swap them at a constant height.

CLS in the field: AEM and Magnolia websites in the DACH region

On mobile, 83.8 percent of AEM websites and 85.8 percent of Magnolia websites are in the green range, and only 6.0 and 4.7 percent respectively are in the red range. On mobile, more websites are thus in the green range for layout stability than for Largest Contentful Paint. Desktop looks different: there only 69.3 and 74.1 percent respectively are in the green range.

The full distribution with datasets you can recalculate is in the Core Web Vitals Benchmark. Where layout shifts arise on the individual systems is described in Adobe Experience Manager Performance and Magnolia CMS Performance. The second metric that arises in the browser is Interaction to Next Paint.

Book a free performance analysis

30 minutes via video call. You see which components shift the layout on your pages.

Frequently asked questions about Cumulative Layout Shift

How is Cumulative Layout Shift calculated?

For every unexpected shift, the browser multiplies the share of the affected area by the distance the content moves. The scores are grouped into time windows of at most five seconds, and the worst window counts. A value up to 0.1 is good, anything above 0.25 is poor.

Does every shift count?

No. Shifts within 500 milliseconds after a user input are considered expected and are not included. A menu that opens after a click is therefore not critical. A consent banner that appears without user action and shifts the content, however, counts in full.

What causes the values in practice?

Images and embeds without reserved dimensions, late-loading ads and teasers, consent banners, fonts that rewrap the text after loading, and personalized components that are swapped after initial rendering. On large platforms, it is often the last three.

How good are the values in the DACH region?

Better than the main content load time on mobile, weaker on desktop. In Christian Schreiber's own survey, on mobile 83.8 percent of AEM websites and 85.8 percent of Magnolia websites are in the green range. The median is 0.01 and 0.00 respectively.

Is it enough to add height and width to images?

It is the most effective single step, but it covers only part of the problem. Equally necessary are reserved space for late-loading areas, a consent banner that overlays the content instead of shifting it, and fonts that are swapped without a jump in line height.