Битрикс и WebP. Генерация (конвертация) jpg, png в webp

В ходе оптимизации работы одного из проектов на 1С-Битрикс пришлось разобраться с вопросом быстрой конвертации изображений из png, jpg в webp. На текущий момент на маркетплейсе нет ни одного решения на эту тему, а так же все решения в сети предлагают генерировать webp файлы через настройки linux. Данный подход меня не очень устраивал, по этому был написан небольшой класс для работы с изображениями в 1С-Битрикс.

Качаем его по ссылке

Далее переименовываем его из .txt в .php. Кладём, например, в папку /local/php_interface/user_class. В init.php подключаем:

CModule::AddAutoloadClasses("", array(
    '\Bas\Pict' => '/local/php_interface/user_class/classPict.php',
));

Теперь мы готовы к тому, что бы генерировать webp из jpg или png для изображений, содержащихся в инфоблоках 1С-Битрикс. Например: картинки новостей, товаров и т.д.

Но в дальнейшем, думаю, при переосмыслении данного подхода, можно будет заменять и любую другую картинку на странице.

Для примера рассмотрим замену изображений в карточке товара. Для начала инициализируем наш класс:

use \Bas\Pict;

Далее вызовем метод для генерации webp из детальной картинки:

$arResult['DETAIL_PICTURE'] = Pict::getWebp($arResult['DETAIL_PICTURE']);

В итоге в $arResult['DETAIL_PICTURE'] будет содержаться дополнительная информация о новом файле. Остается только вывести его.

Либо передавая в атрибут src тега img:

<img src="<?=$arResult['DETAIL_PICTURE']['WEBP_SRC']?>" alt="">

Либо используя тег <picture>

<picture>
    <source type="image/webp" srcset="<?=$arResult['DETAIL_PICTURE']['WEBP_SRC']?>">
    <source type="<?=$arResult['DETAIL_PICTURE']['CONTENT_TYPE']?>" srcset="<?=$arResult['DETAIL_PICTURE']['SRC']?>">
    <img src="<?=$arResult['DETAIL_PICTURE']['SRC']?>" alt="<?=$arResult['DETAIL_PICTURE']['ALT']?>">
</picture>

На этом процесс замены jpg или png на webp в карточке товара 1С-Битрикс закончен.

Следует заметить, что на текущий момент класс обрабатывает только файлы хранящиеся в инфоблоках и располагающиеся в папках: /upload/iblock или /upload/resize_cache/iblock. Новые файлы генерируются соответственно в папки: /upload/webp/iblock и /upload/webp/resize_cache

---

P.S. Опыт показал, что данный вариант не всегда отрабатывается корректно. FirstVDS или Бегет выполняют конвертацию нормально, но на TimeWeb возникли проблемы. Возможно нужны определенные настройки сервера, по этому перед использованием рекомендую всё тщательно протестировать.