Мы замерили скорость собственного сайта на боевом сервере. LCP — от 132 до 284 миллисекунд при пороге 2500. Это хороший результат, но интереснее в этой истории не он, а два способа, которыми мы до этого получали неправильные цифры.
Что такое LCP и почему смотрят именно его
LCP — время до отрисовки самого крупного видимого элемента: обычно это заголовок, крупная иллюстрация или блок первого экрана. Показатель отвечает на вопрос «когда человек увидел то, за чем пришёл», а не «когда браузер закончил всю работу».
Пороги такие:
| Значение LCP | Оценка |
|---|---|
| до 2,5 с | хорошо |
| 2,5–4 с | требует улучшения |
| больше 4 с | плохо |
Считается по 75-му перцентилю реальных посетителей. Это существенно: показатель описывает не средний визит, а тот, хуже которого только четверть.
Ошибка первая: локальный сервер
Первые замеры мы делали на сборке, поднятой простым локальным сервером. Цифры выходили вдвое хуже, и мы уже начали искать, что сломали в оптимизации.
Ломать было нечего. Простой файловый сервер отдаёт страницу без сжатия, а боевой — со сжатием. Разница в весе получалась двукратной, и она полностью объясняла «ухудшение».
Отсюда правило: замер скорости делается на том же сервере, что отдаёт сайт людям. Локальная сборка годится только для сравнения «до и после» в одинаковых условиях, и то с осторожностью.
Ошибка вторая: LCP не отдаётся напрямую
Второй раз мы получили ровно ноль. Скрипт спрашивал у браузера список записей типа largest-contentful-paint привычным способом — и получал пустоту на странице, которая заведомо отрисовалась.
Причина техническая: этот тип записей не попадает в буфер по имени, и запрос молча возвращает пустой список. Забирать его надо наблюдателем производительности с флагом буферизации.
Нулевой LCP на видимо отрисованной странице — это почти всегда признак такой ошибки, а не рекорд скорости. Если инструмент показывает ноль, сначала проверяется инструмент.
Что показал правильный замер
| Страница | TTFB | FCP | LCP | Крупный элемент |
|---|---|---|---|---|
| Главная | 24 мс | 244 мс | 244 мс | заголовок |
| Страница ниши | 19 мс | 132 мс | 132 мс | заголовок |
| Страница города | 21 мс | 148 мс | 148 мс | заголовок |
| Раздел проверок | 17 мс | 284 мс | 284 мс | блок первого экрана |
Крупным элементом везде оказался текстовый заголовок, а не картинка. Для сайта, где первый экран текстовый, это ожидаемо и хорошо: шрифт загружается раньше любой иллюстрации.
Заодно проверили давнее подозрение: не мешают ли замеру анимации появления. Прогнали каждую страницу дважды — обычным способом и в режиме, где браузер просит убрать анимацию. Разница уложилась в разброс между прогонами, местами режим без анимаций оказался даже медленнее. Подозрение снято замером, а не спором.
Почему PageSpeed молчит про молодой сайт
Официальный отчёт по реальным пользователям строится на выборке, которую браузер собирает с живых посетителей. У сайта возрастом два месяца её не набирается, и отчёт остаётся пустым.
Остаётся лабораторный замер — он отвечает всегда. Но называть его Core Web Vitals нельзя: это разные вещи. Лаборатория меряет один прогон с быстрого сервера по проводу, Core Web Vitals — распределение по тысячам живых визитов с телефонов в метро.
Поэтому в собственных материалах мы пишем «замер с сервера по проводу», а не «наши Core Web Vitals 0,24 секунды». Второе звучало бы лучше и было бы неправдой.
Порядок, если хотите померить у себя
- Мерить на боевом адресе, а не на локальной сборке.
- Проверить, что сжатие включено: без него вес страницы отличается в разы.
- Забирать LCP наблюдателем с буферизацией, а не запросом списка по имени.
- Прогнать каждую страницу минимум дважды и смотреть на разброс, а не на одно число.
- Отдельно проверить поведение при отключённой анимации — она способна сдвинуть момент главной отрисовки.
- Не выдавать лабораторный результат за данные реальных пользователей.
Проверить скорость своего сайта можно нашей бесплатной проверкой: она показывает время ответа сервера, вес страницы, сжатие и блокирующие ресурсы по отдельности. Подробнее про пороги и про то, что INP заменил FID, — в разборе Core Web Vitals.