Cumulative Layout Shift

Cumulative Layout Shift (CLS) quantifies how much elements within the viewport move around during page load. CLS helps pinpoint how often unexpected movement occurs on your pages.

How is Cumulative Layout Shift calculated?

The Cumulative Layout Shift score is the sum of scores from all of the unstable elements that move around during page load. CLS is under active development and the exact formula might change, but currently, the layout shift score is a product of:

  • the distance that unstable elements have moved—distance fraction
  • the surface area of the viewport that’s affected by unstable elements—impact fraction

Learn more in Cumulative Layout Shift: Measure and Avoid Visual Instability and in Milica Mihajlija’s post, The New Generation of Performance Metrics for Better User Experience.

What Cumulative Layout Shift measurement is fast?

Good CLS MeasurementPoor CLS Measurement
≤ 0.1> 0.25

Related Articles