Cumulative Layout Shift (CLS)

A Core Web Vital measuring the sum of unexpected layout shifts during the page lifecycle. The 75th-percentile target is 0.1 or less. Driven mostly by images without explicit dimensions and dynamically inserted DOM.

Each shift is scored by area moved times distance moved, summed over the page’s lifetime, weighted by viewport. Setting width and height (or aspect-ratio in CSS) on images and iframes prevents the most common shifts. Reserved space for late-arriving banners (cookie consent, signup CTAs) and font-display strategies that minimise FOIT/FOUT also reduce CLS. About 70% of CLS regressions trace to images without dimensions.