Сергей Сорокин · Оптимизация загрузки
Как я уменьшил файлы изображений и HTML в Pozostools
Опубликовано Обновлено
При открытии главной Pozostools браузер загружал изображения скрытых подменю и следующих слайдов баннера. Одна плитка ниже первого экрана занимала 473 КБ. В сентябре 2026 года я уменьшил файлы изображений, отложил загрузку скрытых картинок и убрал из первоначального HTML подменю для телефона и фиксированной шапки.
Почему начал с содержимого страницы
Магазин работает на Битриксе и готовом решении «Аспро: Next». Я разработал сайт на этой основе и продолжаю его поддерживать. Оформление и базовые компоненты взяты из Аспро; в этой задаче менял загрузку изображений и навигации.
По предварительной проверке 15 сентября сервер отдавал первый байт примерно за 0,3 секунды из композитного кеша и за 0,4–0,6 секунды при обходе кеша. Это время до начала ответа, а не до появления готовой страницы. Медленный ответ в этих запросах не подтвердился.
В первоначальном HTML находились разные варианты навигации, включая меню для телефона и фиксированной шапки. Браузер также получал картинки скрытых подменю. Я начал с этих ресурсов и баннеров на главной.
Уменьшил изображения и изменил загрузку слайдов
Для баннеров и плиток добавил уменьшение разрешения и подготовку WebP-копий. Разрешение определяет ширину и высоту картинки в пикселях, а формат влияет на размер файла. После обработки та плитка занимала 34 КБ вместо 473 КБ, нижний баннер занимал 46 КБ вместо 282 КБ.
Готовая WebP-копия используется повторно и обновляется при изменении исходника. Если создать ее не удалось, обработчик возвращает исходное изображение.
У слайдера оставил немедленную загрузку первого слайда. Загрузка всех остальных начинается после события загрузки страницы либо перед первым перелистыванием. Они могут скачаться до того, как покупатель их увидит. Картинки скрытых подменю тоже перевел на отложенную загрузку.
Первый замер не учитывал фоновые баннеры ниже первого экрана. После отдельной проверки я обработал оставшиеся тяжелые файлы. Еще пришлось сверить размеры с сервером, потому что браузер брал часть старых изображений из кеша.
Что показали проверки 23 сентября 2026 года
В отчетах по главной на компьютере зафиксированы 230 загруженных изображений до работ и 46 после обработки изображений. Оценка их общего объема изменилась с примерно 2,7 до 0,6 МБ, без HTML, скриптов и других ресурсов.
Эти числа получены при разных условиях. Исходные 2,7 МБ восстановлены из первого замера 1,7 МБ и примерно 1 МБ пропущенных фонов. Итоговые 0,6 МБ пересчитаны по новым размерам файлов на сервере из-за старых копий в браузерном кеше. Это историческая оценка объема изображений; точное сравнение требует повторных замеров по одному протоколу. Замера «до» на телефоне нет.
После отдельного этапа с меню несжатый HTML главной уменьшился с 698 до 316 КБ. При передаче со сжатием gzip он занимал 43 КБ вместо 77 КБ. Число элементов разметки сократилось с 5787 до 2956. Эти показатели относятся к главной.
Сокращение ресурсов не означает такой же прирост скорости. Устройство, условия сети и состояние кеша для всех исторических проверок не сохранены полностью. Итоговое время загрузки, оценка PageSpeed и Core Web Vitals после работ не измерялись.
Что проверить перед оптимизацией другого магазина
Выберите страницы, на которых заметна задержка. Главная, раздел и карточка товара могут загружать разные ресурсы. Для каждой сохраните условия проверки: устройство, размер окна, сеть, состояние кеша и действия после открытия.
Повторите сравнение при тех же условиях. Кроме объема ресурсов измерьте время появления содержимого. После изменения меню проверьте раскрытие разделов, переход в карточку и возврат, в том числе на настоящем телефоне.
