Налаштування 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