Настройка WebP-конвертации изображений в 1С-Битрикс

Настройка WebP-конвертации изображений в 1С-Битрикс

Мы не раз сталкивались с ситуацией, когда на типовом интернет-магазине Битрикс страница каталога грузит 40–80 изображений. JPEG и PNG весят в сумме 2–5 МБ — это секунды задержки на мобильном соединении. WebP при сопоставимом качестве даёт 25–35% выигрыша по размеру. Проблема в том, что «включить WebP» в Битриксе — не одна кнопка, а связка из нескольких механизмов, каждый из которых может молча не работать. Мы поможем разобраться и настроим конвертацию под ваш проект. Разберёмся, из-за чего возникают сложности и как их обойти, чтобы ускорить загрузку страниц на 30% без потери качества. Экономия трафика для каталога из 1000 товаров с 5 изображениями каждый может достигать 150 МБ при каждой загрузке страницы, что сокращает расходы на хостинг на 3000–5000 рублей в месяц для магазина с посещаемостью 5000 уникальных посетителей в день.

Почему WebP не включается одной кнопкой в Битриксе?

Ядро использует модуль main (класс CFile) для хранения файлов и модуль resize_image для генерации превью. Физически ресайзер вызывается через \Bitrix\Main\Web\Image или через старый API CFile::ResizeImageFile(). Результаты кешируются в bitrix/cache/resize_cache/ с хешированными именами папок.

WebP-конвертация в Битриксе реализована двумя путями:

• Путь 1 — серверная конвертация через PHP. Библиотека GD или Imagick конвертирует при ресайзе. Настраивается в bitrix/php_interface/dbconn.php или через административный интерфейс в разделе «Производительность».
• Путь 2 — конвертация на уровне веб-сервера. Nginx/Apache отдаёт .webp-версию вместо оригинала, если браузер поддерживает формат (заголовок Accept: image/webp). Файлы конвертируются заранее — скриптом или демоном.

Какой подход эффективнее: PHP-конвертация или Nginx?

Nginx-конвертация в 5 раз снижает нагрузку на процессор по сравнению с PHP при каждом запросе, так как статические файлы отдаются напрямую. PHP-путь проще в настройке, но требует ресурсов при каждом ресайзе. Рекомендуем комбинировать: генерировать превью через PHP на лету для редко запрашиваемых изображений, а для популярных — предварительно конвертировать через Nginx.

Как настроить серверную конвертацию?

Проверка GD и Imagick

php -r "echo gd_info()['WebP Support'] ? 'WebP OK' : 'WebP NOT supported';"
php -r "echo (new Imagick())->queryFormats('WEBP') ? 'Imagick WebP OK' : 'fail';"

Если GD собран без WebP — нужен libwebp-dev и пересборка, либо переход на Imagick. На Bitrix VM проблем обычно нет — там Imagick с WebP идёт из коробки.

Конфигурация в Битриксе

// bitrix/php_interface/dbconn.php
define("BX_USE_MYSQLI", true);
define("CACHED_b_file", 3600);
// Включение WebP в модуле resize
\Bitrix\Main\Config\Option::set('main', 'use_webp', 'Y');
\Bitrix\Main\Config\Option::set('main', 'webp_quality', '85');

После этого \Bitrix\Main\Web\Image::resize() будет возвращать .webp если клиент поддерживает формат. Проверить можно в таблице b_file — поле CONTENT_TYPE у новых превью должно быть image/webp.

Рекомендованные параметры WebP

Конвертация на уровне Nginx

Это производительнее: PHP не тратит CPU на конвертацию в момент запроса. Схема: при первом запросе генерируем .webp-версию рядом с оригиналом, Nginx проверяет её наличие и отдаёт если браузер поддерживает.

map $http_accept $webp_suffix {
    default   "";
    "~*webp"  ".webp";
}

server {
    location ~* ^/upload/.*\.(png|jpg|jpeg)$ {
        add_header Vary Accept;
        try_files $uri$webp_suffix $uri =404;
    }
}

Предварительная конвертация скриптом cwebp:

find /var/www/bitrix/upload -name "*.jpg" -o -name "*.png" | \
  xargs -P4 -I{} sh -c 'cwebp -q 82 "$1" -o "$1.webp" 2>/dev/null' _ {}

Запускать через cron раз в час для новых файлов — по дате изменения через find -newer.

Как очистить кеш превью после включения WebP?

После включения WebP старые превью в bitrix/cache/resize_cache/ остаются в JPEG/PNG. Нужно их удалить:

rm -rf /var/www/bitrix/bitrix/cache/resize_cache/*

Или через административную панель: «Управление сайтом» → «Производительность» → «Очистить кеш». После этого превью регенерируются при первом обращении — можно прогреть curl-скриптом по sitemap.

Типовые проблемы и их решение

WebP генерируется, но браузер получает JPEG. Чаще всего Nginx не передаёт заголовок Vary: Accept — CDN или кеширующий прокси отдаёт закешированную версию без учёта типа браузера. Размер WebP может быть больше оригинала на мелких иконках (до 10×10 px) и PNG с малым количеством цветов. Стоит добавить проверку: если WebP больше оригинала на 10%, отдавать оригинал. Ошибки в b_event_log возникают при включённой конвертации и отсутствии прав на запись в upload/. Проверить chown на директорию upload/ от имени пользователя веб-сервера.

Что входит в работу по настройке WebP?

В рамках услуги мы выполняем:

• Аудит текущей конфигурации сервера и Битрикса.
• Настройку GD/Imagick или Nginx для конвертации.
• Создание скрипта для предварительной конвертации и настройку cron.
• Тестирование на стенде и боевом сервере.
• Документацию по эксплуатации и поддержку после внедрения.

Мы занимаемся разработкой на Битрикс более 8 лет и реализовали свыше 120 проектов с оптимизацией производительности. Если вы хотите ускорить загрузку вашего сайта и сократить расходы на трафик, получите консультацию по настройке WebP — мы оценим ваш проект и предложим оптимальное решение.

Источник: WebP — Wikipedia