Напомним, что уменьшать размеры файлов изображений на сайте необходимо, чтобы увеличить скорость их загрузки у посетителей. Чем быстрее загружается контент, тем привлекательнее сайт для посетителей.
Как и в прошлой статье, задача будет посталена так: необходимо оптимизировать все изображения относительно текущей папки, включая изображения во всех вложенных вне зависимости от уровня (вложенности). Чтобы это реализовать нам опять понадобится команда поиска файлов "find".Все действия в статье будем проводить на дистрибутиве Linux, с установленным пакетом ImageMagic и Jpegoptim. Этот пакет можно установить как на сервере, так и на персональном компьютере.
Изменение геометрического размера JPG
Для начала изменим размер тех картинок, которые больше, чем 1000 на 1000 пикселей. Эту величину необходимо выбирать из вёрстки сайта. Например, если картинка может отображается на сайте в области 2000 на 2000 пикселей, то необходимо указать именно этот размер. Но отображать большие картинки в маленьких областях не имеет смысла - это будет пустая трата места и скорости загрузки.Для уменьшения размера нам понадобится перейти в корневую папку, относительно которой во всех вложенных будет происходить конвертация изображений. И выполнить такую команду:
find . -name "*.jpg" -exec echo "'{}'" \; | xargs identify -format '%w %h %i\n' | awk '$1 > 1000 || $2 > 1000 {sub(/^[^ ]* [^ ]* /, ""); print}' | tr '\n' '\0' | xargs -0 mogrify -resize 1000x1000
Команда находит каждый файл и проверяет его размер. Если размер по ширине или высоте больше 1000 пикселей, то изображение уменьшается. Но если картинка и так маленькая, то с файлом не производится никаких действий. Попробуем разобрать все составляющие этой команды:
- find . -name "*.jpg" -exec echo "'{}'" \; - находит все файлы с расширением ".jpg" (пути к ним содержатся в
{}
). Ключ exec вызывает команду "echo", которая распечатывает (и передаёт по конвейеру) путь к каждому найденному файлу. - | xargs identify -format '%w %h %i\n' - конвейер "|" (вертикальная черта) и xargs передаёт вывод предыдущей команды в утилиту identify, которая анализирует изображение и печатает ширину "%w", высоту "%h" и путь к файлу "%i"
- | awk '$1 > 1000 || $2 > 1000 {sub(/^[^ ]* [^ ]* /, ""); print}' - сравнивает ширину и высоту со значением 1500. Если какое-либо значение превышает это, то удаляет размеры из строки, оставляя путь к файлу и печатает его
- | tr '\n' '\0' - обрезает нулевой бит и перенос строки, подготавливая для передачи на вход в mogrify
- | xargs -0 mogrify -resize 1000x1000 - изменяет размер изображения
Обратите внимание, что при выполнении этой команды не будет происходить никакого вывода в терминал. Поэтому если изображений много, то может показаться что команда "повисла". Стоит дождаться завершения процесса.
Изменение качества JPG
После завершения изменения размеров остаётся только изменить качество изображений. Для этого используем пакет jpegoptim. Выполним команду, которая опять начнётся с поиска файлов через "find", чтобы произвести изменения со всеми изображениям и во всех вложенных папках:find . -name "*.jpg" -exec jpegoptim {} --strip-all --all-progressive --max=70 \;
Разберём содержание команды:
- find . -name "*.jpg" -exec jpegoptim {}... - находит все файлы с расширением ".jpg" (пути к ним содержатся в
{}
). Передаёт путь к файлу на вход в jpegoptim - jpegoptim {} --strip-all --all-progressive --max=70 \; - ключ "strip-all" заставляет удалять метаданные изображений, чтобы уменьшить размер файлов. Ключ "max=70" ограничивает качество JPG на 70 процентах (чем больше, тем лучше качество и больше размер). Ключ "--all-progressive" заставляет делать сделать прогрессивное изображение, которое в отличии от простого загружается не сверху вниз, а сразу полностью с постепенно улучшающимся качеством (только начали загружать - плохое качество, загрузили файл полностью - отличное).