TGViewer
Defront — про фронтенд-разработку и не только Defront — про фронтенд-разработку и не только @defront · 5.05K subscribers
Post #689 3.16K
Ник Джансма из Akamai написал большую статью про метрику CLS — "Cumulative Layout Shift in Practice".

Метрика CLS (Cumulative Layout Shift) показывает, насколько контент страницы стабилен. Большой показатель CLS обычно говорит о том, что у страницы плохой пользовательский опыт. Например, когда сдвигается текст из-за загрузки изображения или рекламных виджетов.

В статье рассказывается о том, как вычисляется CLS, какие есть инструменты для её анализа и чем эти инструменты отличаются друг от друга. Также в статье есть список подводных камней, которые нужно учитывать при анализе проблем сдвига контента:

— CLS на мобильных устройствах выше, потому что контент на мобильных сайтах располагается вертикально, поэтому при анализе проблем CLS рекомендуется разделять статистику для десктопов и мобильных;
— момент времени, когда останавливается сбор метрики CLS, для разных инструментов разный;
— в инструментах разработчика есть баги при измерении сдвига контента внутри iframe'ов, также есть несоответствия в инструментах для сбора синтетической статистики и статистики с устройств реальных пользователей;
— в некоторых случаях страницы с высоким CLS могут предоставлять хороший пользовательский опыт;
— CLS не учитывает элементы, которые ничего не рендерят.

Очень большая и хорошая статья. Рекомендую почитать всем, кто интересуется темой производительности.

#performance #metrics

https://nicj.net/cumulative-layout-shift-in-practice/
More from @defront
  1. Jan 7, 2024Channel name was changed to «Defront — про фронтенд-разработку и не только»
  2. Feb 24, 2022Про войну в Украине Шлю лучи поддержки братьям и сёстрам украинцам. В моём окружении нет н…
  3. Feb 23, 2022Qwik — возобновляемый JavaScript-фреймворк Райан Карниато поделился своими мыслями после р…
  4. Feb 22, 2022Обработка ошибок с помощью reportError Стэфан Джудис рассказал про малоизвестный метод для…
  5. Feb 21, 2022Выбор библиотеки по её размеру Владимир Клепов рассказал про подводные камни выбора библио…
  6. Feb 10, 2022Time-travel debugging в Svelte Сэм Ван Тассел рассказал про DeLorian — новый инструмент дл…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →