+7 707 858 58 37
help@vpsadm.ru
Скрипт для оптимизации всех изображений под Google Pagespeed Insights

Как оптимизировать картинки на сайте или сервере?  Все. Разом.

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

Зачем нужно оптимизировать картинки?

Зачем ему это нужно? Засчёт этого уменьшается объём передаваемых данных, соответственно,  загрузка страницы происходит быстрее.

google-pagespeed-optimization-images-need

Это лишь  один из шагов по оптимизации сайтов под Pagespeed, но, по мнению Google,  очень важный.  Он позволяет увеличить оценку в Pagespeed Instights на 2-10 баллов.

Чем оптимизировать?  Скриптом

Ставим софт:

#deb-based
apt-get install -y  jpegoptim optipng
#rpm-based
yum install -y jpegoptim optipng

Засовываем это в файл optimages.sh:

#!/bin/bash
/usr/bin/find $1 -type f -iname '*.jpg'  -exec /usr/bin/jpegoptim -q -f -o --strip-all {} \; >/dev/null 2>&1
/usr/bin/find $1 -type f -iname '*.png' -exec /usr/bin/optipng -quiet -o7  {} \; >/dev/null 2>&1

Запускаем:

./optimages.sh   /var/www/user/site.com

Предварительно на всякий случай рекомендуется сделать бэкап всех изображений:
(каждый символ в команде очень важен!)

rsync -avh --include '*/' --include '*.jpg' --include '*.png'  --exclude '*' /var/www/user/site.com/   /var/backup/site-com-images/

Если вдруг понадобится откатить:
(ни в коем случае не терять завершающий слеш в путях!)

rsync -a /var/backup/site-com-images/ /var/www/user/site.com/

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

#!/bin/bash
/usr/bin/find $1 -type f -iname '*.jpg' -mmin -120  -exec /usr/bin/jpegoptim -q -f -o --strip-all {} \; >/dev/null 2>&1
/usr/bin/find $1 -type f -iname '*.png' -mmin -120  -exec /usr/bin/optipng -quiet -o7  {} \; >/dev/null 2>&1

И в крон, на запуск каждые 2 часа:

#deb
echo '0 */2 * * *  /root/optimages.sh /var/www/user/site.com'  >> /var/spool/cron/crontabs/root
#centos
echo '0 */2 * * *  /root/optimages.sh /var/www/user/site.com'  >> /var/spool/cron/root

Если вдруг хочется залоггировать всё что сделал скрипт:

#!/bin/bash
/usr/bin/find $1 -type f -iname '*.jpg' -mmin -120  -exec /usr/bin/jpegoptim -f -o --strip-all {} \; >>/var/www/user/optimages.log 2>&1
/usr/bin/find $1 -type f -iname '*.png' -mmin -120  -exec /usr/bin/optipng  -o7  {} \; >>/var/www/user/optimages.log 2>&1

Возможные проблемы с картинками и  оценкой гугла

Инструмент этот Pagespeed Insights на самом деле ебанутый. (Что признают и сами гугловцы,  sic! ) По крайней мере во всём, что касается  изображений он точно гонит.   Вот этот метод работает согласно справке самого гугла.  И после оптимизации таким образом, он один хуй будет показывать что картинки можно оптимизировать ещё.

Тем более он не поможет, если у вас там изображения слишком большие, и подогнаны атрибутами width и height или еще каким-то html способом. Типа сам файл можно уменьшить, а атрибуты убрать.  Это тоже можно кстати сделать аналогичным скриптом, только использовать надо resize из пакета imagemagick

Бонусы  — скрипт для обрезки, зеркалирования, и поворота  всех  изображений  в папке/на сайте/на сервере

Я сегодня добрый, держите, выложу как на духу.

Предварительно нужно поставить imagemagick, но скорей всего он у тебя уже и так стоит на VPS

apt-get install imagemagick
yum install imagemagick

Вот таким способом я выпиливаю ватермарк по краю:

find /var/www/user/site.com -type f -name '*.png' -o -name '*.jpg' -exec convert {} -crop +0-23 ./{} \;

Это срежет нижнюю часть всех изображений — 23 пикселя. Если тебе нужно выпилить ватермарк с другой стороны — играйся с этими цифрами. Только забэкапь бля! Или вообще лучше играйся на тестовой копии папки со всей своей трехомудией.

Вот этим можно массово зеркалить картинки (привет уникализаторам, ага):

for file in `find /var/www/user/site.com -type f -name '*.png' -o -name '*.jpg'`; do convert "$file" -flop  "$file"&& echo $file >> /root/flop-images.log; done &
#c логгированием, понял?! можно по логу прогресс отслеживать

Поворот всех изображений на 90 градусов вправо (по часовой стрелке):

 for file in `find /path/to/dir/with/images -type f -name '*.png' -o -name '*.jpg'`; do convert "$file" -rotate 90 "$file"; done

А если надо влево — то -90 нужно указать.

Тут и до ресайза чуток осталось, но мне лень гуглить.  Как-нибудь в другой раз.

This is the magick.

Отправить ответ

Notify of
avatar
seoonly.ru
Гость

Спасибо!!!

vataka
Гость

Поворот всех изображений на 3/-3 градуса тоже будет работать? с подрезкой углов?

MrVigner
Гость

Сколько не сжимай, а этот Pagespeed Insights все равно будет ругаться что можно еще. В итоге я забил на эти сжатия, установил WP Smush и он лишь на пару процентов сокращает «вес» картинки. Все равно в статье грузятся уменьшенные копии, сделанные вордпрессом, а они намного легче оригиналов. Так что страницы норм загружаются)

Никита
Гость

Стоит плагин TinyPNG на вордпресе, есть смысл прогонять этим скриптом? А то бесит, что не один плагин не может подогнать чтобы мобильная версия не была 55 балов. Только из-за этого понижает уровень.

Жанат
Гость

Надо просто включить ленивую загрузку. И сайт загрузится быстро и балы наберет больше.

Den
Гость

читать противно, мат зачем?

Константин
Гость

Ку, а EXIF/IPTC очистить как можно? для уникализации
ещё круто было бы заполнить рандомной информацией

Константин
Гость

Подскажи что это за ошибка

[root@vmi137 ~]# convert: Corrupt JPEG data: 770 extraneous bytes before marker 0xe2 `/var/www/user/data/www/domain.ru/uploads/posts/2018/1/sura-gostinica.jpg’ @ warning/jpeg.c/JPEGWarningHandler/346.

Что-то быстро выполняется скрипт при пару десятков тысяч картинок

wpDiscuz