Cumulative Layout Shift (CLS) measures visual stability - how much content unexpectedly moves during loading. It's one of Google's three Core Web Vitals and affects both UX and search rankings.

Thresholds

Google recommends a score of 0.1 or less for at least 75% of page visits.

How CLS Is Calculated

CLS quantifies unexpected shifts by multiplying impact fraction (viewport affected) by distance fraction (how far elements moved). User-initiated shifts within 500ms of interaction don't count.

Why It Matters

Layout shifts cause accidental clicks and lost reading position. 79% of mobile sites pass CLS - it's the best-performing Core Web Vital. Redbus reduced CLS to 0 and saw 80-100% higher conversions.

Common Issues

• Images without width/height dimensions
• Ads and embeds without reserved space
• Web fonts causing text reflow
• Dynamically injected content

Measure CLS

• Chrome DevTools Performance panel
• Lighthouse audit
• PageSpeed Insights (field data)
• Web Vitals Chrome extension

→ Complete CLS Guide