CLS - Cumulative Layout Shift (Web Vitals)

Cumulative Layout Shift (CLS) is an important user experience metric. It measures visual stability by quantifying how often users encounter unexpected layout shifts on the page.

If you've ever read an article and the content suddenly jumps without any action from you, or worse, tried to click a button that moved, you've experienced a page with poor CLS.

CLS helps by measuring how frequently this happens for users on your site.

What is CLS?

CLS measures the sum of scores of unexpected layout shifts occurring during the page's lifecycle.

A layout shift occurs when a visible element changes position on the page.

The score depends on the size of the element and the distance it moves.