Мобильная версияЯ прочитал этот вопрос, уже выполнил все предложенные пункты, но все еще сталкиваюсь с огромной задержкой загрузки для моего LCP.
- Мой LCP — это
внутри Bootstrap Carousel, используемый как фон - У есть различные источники, в том числе веб-версия и веб-версия с измененным размером:
Код: Выделить всё
^^^ this is the one that gets used for the LCP
[img]http://localhost:8888/image.jpg[/img]
- Я добавил и на вкладке сети инструментов разработки я вижу, что это фактически первый загружаемый источник. Его размер составляет 14 КБ, а загрузка занимает 2 мс.
Я думаю, что задержка загрузки не описывает, когда источник изображения был загрузился, да? Описывает ли оно задержку, которую требуется средству рендеринга для правильного отображения этого элемента? Если последнее, я действительно не знаю, что еще улучшить. У меня есть 2 CSS-файла, один из которых является загрузочным, другой — пользовательский, оба минимизированы и сжаты с помощью gzip и объединены размером менее 50 КБ. Даже упаковка их в один файл ничего не меняет.
Я получаю только 2 диагностические рекомендации от Lighthouse. Первый из них — «Устранить ресурсы, блокирующие рендеринг» с потенциальной экономией 2700 мс. Как уже было сказано, у меня есть только две таблицы стилей: bootstrap.min.css и мой минимизированный main.min.css. Я не могу разделить их расположение или поместить их в конец страницы, потому что это приведет к появлению большего количества красных флажков, таких как сдвиги макета, и фактически вдвое снизит мою оценку производительности.
Google рекомендует помещать встроенные стили в верхние элементы, а после этого загружать таблицы стилей, что для меня звучит как безумие и на самом деле невозможно для многих крупных сайтов, и я действительно смущен тем, что что-то иное, чем это, будет наказано.
Вторая запись — это просто большой элемент LCP в целом:
Фаза
% от LCP
Время
TTFB
8%
450 мс
Задержка загрузки
68%
3720 мс
Время загрузки
1%
40 мс
Задержка рендеринга
23%
1280 мс
Кроме того, Lighthouse в инструментах разработки просит меня минимизировать js расширений Chrome, что звучит странно...
Итак, есть идеи, чего мне не хватает? В настоящее время я играю с mod_pagespeed на Apache, возможно, это поможет.
Изменить
На вкладке «Производительность» я действительно вижу лучшие результаты для моих LCP и FCP после реализации многих мер. Я до сих пор не понимаю отчеты LH.
Обновление 2025 г.
Я установил mod_pagespeed, и с тех пор страница получает отличные оценки. Я не уверен, но все же думаю, что первоначальные плохие оценки были вызваны ошибками. Возможно, расширения Chrome также играют роль.
Подробнее здесь: https://stackoverflow.com/questions/780 ... cp-results
