Битрикс и 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. Для корректной поддержки альфа-каналов, у вас должна быть установлена библиотека GD версии 2.2.5 и выше. (Она уже входит в PHP 7.3)

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

Читайте также