mail@vecdev.ru

Уменьшение размера изображений в 1С-Битрикс через кеш. Метод CFile::ResizeImageGet.

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

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

Использование метода сжатия изображений

<?$renderImg = CFile::ResizeImageGet("ID_КАРТИНКИ", Array("width" => "НОВАЯ_ШИРИНА", "height" => "НОВАЯ ВЫСОТА"), BX_RESIZE_IMAGE_PROPORTIONAL, false); ?>
<img src="<?=$renderImg["src"]?>" alt="Описание картинки"/>
                        
                        

ResizeImageGet

$renderImg["src"]

Вместо "ID_КАРТИНКИ" может быть подставлено любое значение, например:

  • $arResult["PREVIEW_PICTURE"]
  • $arResult["DETAIL_PICTURE"]
  • $FILE = CFile::GetFileArray($arResult["DISPLAY_PROPERTIES"]["КОД_СВОЙСТВА"]["VALUE"]);

Типы масштабирования

Лично я достаточно часто использую третий метод изменения размеров, он не обрезает картинку и почти никогда не портит её качество.

  • BX_RESIZE_IMAGE_EXACT
  • BX_RESIZE_IMAGE_PROPORTIONAL
  • BX_RESIZE_IMAGE_PROPORTIONAL_ALT

Примеры использования


<?
//обрезаем картинку анонса новости
$renderImg = CFile::ResizeImageGet($arResult["PREVIEW_PICTURE"], Array("width" => 300, "height" => 200), BX_RESIZE_IMAGE_PROPORTIONAL_ALT, false); ?>
<img src="<?=$renderImg["src"]?>" alt="<?=$arResult["NAME"]?>"/>

<?
//обрезаем картинку свойства новости и вставляем её в background
$FILE = CFile::GetFileArray($arResult["DISPLAY_PROPERTIES"]["ATT_IMG"]["VALUE"]);
$renderImg = CFile::ResizeImageGet($FILE , Array("width" => 300, "height" => 200), BX_RESIZE_IMAGE_PROPORTIONAL_ALT, false); ?>
<div style="background: url('<?=$renderImg["src"]?>')"></div>

 

В итоге уменьшенные картинки попадут в папку /upload/resize_cache/путь и при повторных вызовах метод ResizeImageGet будет сразу возвращать путь к уменьшенной версии изображения.

Для достижения еще большей скорости загрузки можно сконвертировать все изображения (в том числе и закешированные уменьшенные версии) в формат WebP, о том как это сделать читайте в нашей статье.

Частный разработчик сайтов Vector Dev
Комментарии
Загрузить файл или картинкуПеретащить с помощью Drag'n'drop
Перетащите файлы
Ничего не найдено
Защита от автоматических сообщений
 
Uri
21.01.2022
Спасибо!