Оптимизация изображений на сайте
Делимся методом безопасной оптимизации изображений на сайте за 15 минут!

Простой и эффективный способ оптимизации изображений без потери качества. Прямо с кодом внутри! Идеально для Битрикса, но с правками подойдет для любого сайта.
Скажу сразу, метод подходит только для виртуальных и выделенных серверов, код для CentOS, так как почти все битриксоиды сидят на нем. Если ваш сайт на виртуальном хостинге — меняйте хостинг :) Серьезно, VPS быстрее и удобнее, а по деньгам не сильно дороже.

Задача проста — снизить вес изображений на сайте, но без потери качества и чтобы не были затронуты оригиналы изображений. Для интернет-магазинов скорость загрузки страницы после оптимизации изображений может вырасти в 2-3 раза.

Настройка сайта

Первое, что надо сделать — настроить обрезку изображений на сайте под размер области просмотра. На 1С-Битрикс это делается в настройках инфоблоков, именно там задаются максимальные размеры изображений и указывается как обрезать изображение, если размер больше. Все нормальные разработчики это делают обычно. В шаблонах из маркетплейса тоже настроено по дефолту. Будем считать, что вам повезло и тут все в порядке.

Установка ПО

Далее установим на сервер нужное ПО. Наиболее адекватно сжимают изображения утилиты optipng и jpegoptim, косяков за ними не наблюдалось, работают быстро и гибко настраиваются. Заходим по SSH и выполняем команды:
# yum install jpegoptim -y
# yum install optipng -y
Установка займет примерно минуту. После установки мы сможем сразу использовать утилиты, но мы напишем небольшой скрипт для автоматизации.

Создание скрипта

Заходим по SSH или по FTP в папку /home/bitrix/ (если сервер на BitrixENV) или в /root/ (если сервер на CentOS). Создаем файл img-optim.sh и в файл записываем код:
#!/bin/bash
echo "start optimization" $(date +%Y-%m-%d) $(date +%H:%M) >> optimize.log
find /home/bitrix/www/upload/resize_cache/iblock/ -name *.jpg -ctime -1 -exec jpegoptim -m 85 --all-progressive --strip-all '{}' \;
find /home/bitrix/www/upload/resize_cache/iblock/ -name *.png -ctime -1 -exec optipng -strip all -o5 '{}' \;
echo "end optimization" $(date +%Y-%m-%d) $(date +%H:%M) >> optimize.log
echo "=====" >> optimize.log 
Скрипт находит новые изображения в папке /home/bitrix/www/upload/resize_cache/iblock/, оптимизирует их и перезаписывает. После окончания записывает время старта и завершения в лог. Параметр -ctime -1 означает, что будут найдены файлы, созданные один день назад. Если поставить -ctime -365, то будут найдены и оптимизированы все файлы за предыдущий год. Таким образом мы снижаем нагрузку на сервер и оптимизируем только новые файлы. При первом запуске можно удалить этот параметр, чтобы обработались все существующие изображения.
Папка /upload/resize_cache/iblock/ — та самая папка, куда битрикс сохраняет обрезанные по нужным размерам изображения. Именно их мы и оптимизируем, оригиналы не трогаем.
Путь /home/bitrix/www/ обязательно проверьте, возможно у вас он свой. Это абсолютный путь от корня сервера до папки сайта.

Наш файл со скриптом нужно сделать исполняемым, иначе мы не сможем запускать его автоматически, выполняем SSH-команду:
#chmod u+x img-optim.sh

Настройка планировщика

Теперь нужно запланировать запуск нашего скрипта раз в сутки. Лучше выбрать время наименьшей нагрузки на сервер, например, ночью перед автоматическим созданием резервной копии (вы же создаете, да?). Мы будем запускать команду ежедневно в 2 часа 15 минут. Если на сервере есть панель управления, то команда для запуска будет выглядеть так:
cd /home/bitrix/ && bash img-optim.sh
Все остальные настройки задаются обычно через панель управления (название задачи, время выполнения, отправка email при выполнении).
Если панели управления нет, то делаем через SSH. Открываем crontab на редактирование:
# crontab -e

Для начала редактирования вводим:
# i
Вставляем в последнюю строку команду:
15 2 * * * cd /home/bitrix/ && bash img-optim.sh >/dev/null 2>&1
Выполняем последовательно команды сохранения и выхода:
# esc
# :wq
Crontab сообщит, что добавлена новая задача. После запуска скрипта оптимизации можно открыть файл optimize.log и посмотреть когда производились запуски и сколько времени работал скрипт.
Обратите внимание! Скрипт нуждается в доработках под конкретные пути в вашей файловой системе. Вам потребуются хотя бы элементарные знания принципов работы SSH и файловой системы Linux. Все действия по этой инструкции вы выполняете на свой страх и риск, сделайте резервную копию перед началом работ.

Если вы не любите рисковать, то можете обратиться к нам в техническую поддержку и мы всё сделаем сами занедорого :)
Алексей Ковалёв
Алексей Ковалёв

Генеральный директор «Адвебс»

Свежее в блоге

Олег

04

Октября

Личная эффективность - если её нет, то будь ты суперспецом все что ты сможешь сделать это один маленький пшик! Прокрастинация (откладывание дел "на потом") вот бич многих программистов (и не только их).

Алексей Ковалёв

02

Октября

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

Алексей Ковалёв

24

Сентября

Типичная ситуация: руководство озадачило найти подрядчика на разработку интернет-проекта. Нашли, выбрали самых разговорчивых... Но через 3 года проект так и не сдан. Расскажу, как выбирать, о чем спрашивать и на что обратить внимание при выборе подрядчика на разработку. И даже чек-лист дам!

Не знаете с чего начать?
Давайте обсудим вашу задачу. Найдем решение. И реализуем!

+ 7 495 777-39-36
order@adwebs.ru
adwebs