WebP/AVIF дают прирост не «по ощущениям», а по байтам: где экономия, а где только боль

WebP/AVIF дают прирост не «по ощущениям», а по байтам: где экономия, а где только боль

Если на сайте много картинок, миграция почти всегда окупается. WebP обычно режет вес JPEG/PNG на 20–40%, AVIF — ещё сильнее, но ценой более долгой кодировки и более капризной поддержки на слабых клиентах. На практике это бьёт по LCP: меньше килобайт — быстрее первый рендер, особенно на мобайле и при медленном CDN-канале.

Рабочая схема такая:
— для фото и больших баннеров: AVIF как основной формат, WebP как fallback;
— для простых иконок, логотипов, прозрачностей: смотрим, не выгоднее ли SVG или PNG;
— не конвертируем всё подряд: тяжёлые скриншоты и мелкие UI-элементы часто дают смешной выигрыш;
— обязательно ставим `width`/`height`, чтобы не ловить CLS после замены.

Проверять надо не «вес файла», а итоговую страницу: суммарный transfer, LCP, количество запросов и работу ленивой загрузки. Частая ошибка — включили AVIF, но забыли про `srcset`, `picture` и кеширование, в итоге браузер скачивает дубль или берёт слишком тяжёлую версию.

Если нужен быстрый результат без миграционного ада, начните с каталога, главной и топ-лендингов: там самый заметный выигрыш по TTFB не будет, но LCP обычно падает ощутимо. Дальше уже добивайте остальной медиаархив по приоритету.