Ну я вот разместил <link rel="preload" href="/uploads/posts/2025-06/burger.webp" as="image" type="image/webp"> и у изображения дописал fetchpriority="high" и тоже самое, как было Элемент "Отрисовка самого крупного контента" 6 110 мс так и осталось или я еще что-то с JS не сделал?
Это проблема сайтов самописек.Сейчас WP + нормальная тема по умолчанию выдает хороший результат. Пример, на странице 26 фото ..
Так у меня не самописка а движок DLE
Грузите все фото лениво, после загрузки дом дерева, или первую пикчу легковесную
Спасибо, загуглил!)
Не совсем вот это понял сейчас. Я помню что у скриптов например defer пишется, где то пишем preload а что в этой одной картинке дописать тогда чтоб на нее не ругалось? Да и точнее там еще есть картинки но они уже не в скорости а загрузка тех которые нет на страничке на экране и им тоже наверное надо параметр задать чтоб не сразу грузились, вопрос вот как это для изображения делается? А то вес их точно не облегчить итак в web сразу их делал и они образно говоря по паре килобайт всего, меньше некуда.
А вот именно в таком виде помогло! Спасибо! Пошел редактировать!!!! Еще раз спасибо большое за помощь! Но там еще куча других вопросов) Может кто поможет советом? Например: Элемент "Отрисовка самого крупного контента" 6 060 мс грузится единственная картинка, формат webp, весит копейки, единственное что она вставлена в слайдер (листании вправо влево) но при этом загрузка именно изображения такое большое(
В данном случае проблема решается очень легко и почему бы это не сделать? Просто добавить атрибуты width и height в тег img. CSS в данном случае имеет второстепенное значение, он применяется уже после начала рендеринга. Задав размеры картинки вы подскажете браузеру сколько места резервировать для нее, чтобы не было скачков контента (CLS).
Задаю размеры и изображение едет по высоте!!!
Я согласен в целом, но не в этом конкретно случае.
Чего то не получается все равно.. Вот вписал в <img width="500" height="249"> это фактические размеры картинки. В стилях для этого класса прописал .sale img {border-radius: 20px;max-width: 100%;} и фиг там изображение вытянулось по высоте и стало растянутое
Сейчас вот попробую таким способом
Судя по всему как раз и придется это сделать по итогу. Дебилизм на дебилизме а speed page 😡
