CLS (Cumulative Layout Shift) — это метрика Core Web Vitals, измеряющая визуальную стабильность страницы через сумму неожиданных смещений макета, которые происходят в течение жизненного цикла страницы.
"Смещение макета" происходит, когда видимый элемент меняет свое положение с одного отрисованного кадра на следующий без причины, инициированной пользователем. Каждое смещение оценивается по влиянию (насколько переместилась область просмотра) и расстоянию (насколько далеко переместились элементы); CLS — это сумма всех таких смещений. Пороговые значения на 2026 год: ≤ 0.1 хорошо, ≤ 0.25 требует улучшения, > 0.25 плохо.
Распространенные исправления CLS для электронной коммерции: всегда устанавливайте атрибуты width и height для изображений, чтобы браузеры резервировали место; резервируйте место для встроенного контента (iframes, реклама, видео) с явными размерами или CSS с соотношением сторон; избегайте перерасчетов шрифтов, используя size-adjust в @font-face или font-display: optional; не внедряйте баннеры или всплывающие окна над существующим контентом; убедитесь, что скелетные загрузчики соответствуют размерам загружаемого контента, который они заменяют.
CLS часто является самой простой метрикой Core Web Vitals для исправления и наиболее значимой для воспринимаемого качества — даже небольшие смещения макета выглядят непрофессионально.