Оптимизация картинок в image/cache

[AlexBr]

С -sampling-factor можно ещё поэксперементировать http://www.imagemagick.org/script/command-line-options.php#sampling-factor

А еще ImageMagick умеет устанавливать разный color subsampling при кодировании, сменив который со стандартного 4:2:2 на 4:4:4 можно уменьшить визуальные потери даже при меньшем значении параметра quality.

[Otvet]

разницы никакой а размер растет

[AlexBr]

@Otvet, A 4:1:1? 

[bartlebi]

Попробовал модуль поствить, получил в логах  PHP Fatal error: Class 'Imagick' not found in /system/library/image.php on line 25

Кто подскажет, куда копнуть?

ЗЫ:Библиотека есть в пхп, подключается прям в настройках хостинга. Хостер, конечно, отнекивается.

Змінено 16 лютого 2017 користувачем bartlebi

[AlexBr]

В 09.01.2017 в 19:16, Otvet сказал:

 

разницы никакой а размер растет

 

 

4:2:0 вроде как самый оптимальный цвет/размер как пишет автор (10 пункт)

 

[sitecreator]

 

Вся оптимизация изображений есть в этом модуле.

И масса всевозможных функций для работы с изображениями.

По сути - это комбайн.  Водяной знак, адаптивная обрезка, работа с полями и фоном.

Можно удалять лишний фон даже с исходных изображений.

 

 

[termotorg]

В 04.01.2017 в 08:52, 20strannik08 сказал:

Вынужден выразить благодарность всем отписавшимся. Благодаря вам отчасти удалось выкрутиться из ситуации с картинками)

(Я уж было думал мирится с тем что есть)

Установил imagick и модификацию с гитхаба для опенкарт.

 

Файл /system/liblrary/image.php скачаный с гитхаба, какойто странный. Настройки по качеству сжатия он игнорит как не выставляй результат один. Размеры немного ниже оригинала он делает(в случае с jpg), но фотки вроде бы действительно стали лучше, более резкими и пропала размытость.

 

Странный казус с PNG картинками тоже пропал. Теперь исходник PNG в 55kb (предварительно оптимизированный), после загрузки в опенкарт на выходе даже еще меньше стал весить около 54кб. Это отличный результат. Кстати оригиналы фото предварительно прогнанные через optimizilla.com на выходе то же получаются отличными - pagespeed их принял!

Здравствуйте, не могли бы вы написать настройки используемые в файле image.php для достижения оптимального результата. Поставил imagemagic, вес фотографий тот же остался. Фотография из кеша весит больше на 30-40% чем оригинал. Хочется хотя бы не увеличивать объем фото.

Гугл дает зеленый свет когда фотографии оригинальные и ругается после проверки этой же страницы после взятия фотографий из кеша.

Змінено 30 квітня 2018 користувачем termotorg

[20strannik08]

Здравствуйте! А о каких типах изображений конкретно идет речь? jpg или png?

[termotorg]

36 минут назад, 20strannik08 сказал:

Здравствуйте! А о каких типах изображений конкретно идет речь? jpg или png?

Идет речь о jpg. Вес всех оптимизированных фотографий при одинаковом размере в кеше уже весят на 30 - 50%. Гугл не ругается на оригинальные фото, и начинает ругаться на фото из кеша:(

Змінено 30 квітня 2018 користувачем termotorg

[20strannik08]

Imagemagick себя так вести не может. Кеш изображений чистили? Мож еще кеш модификаторов, и сам кеш магазина на всякий почистить? Еще как вариант opcache если включен тоже может проблему создать, по хорошему тоже сбросить если есть возможность конечно.

 

Содержимое файла по пути site/system/library/image.php прилепил. По нему работает отлично:

А вообще у меня в карточке товаров размер полного изображения 800x800px. И я заранее исходники уже по такому размеру нарезаю.

 

 

 

Вот результат страницы в гугле с этим файлом:

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fmagazin-magii.ru%2Foberegi-dlja-doma%2Ftureckij-glaz%2Fsinjaja-podkova.html&tab=desktop

Змінено 30 квітня 2018 користувачем 20strannik08

[termotorg]

17 минут назад, 20strannik08 сказал:

Imagemagick себя так вести не может. Кеш изображений чистили? Мож еще кеш модификаторов, и сам кеш магазина на всякий почистить? Еще как вариант opcache если включен тоже может проблему создать, по хорошему тоже сбросить если есть возможность конечно.

 

Содержимое файла по пути site/system/library/image.php прилепил. По нему работает отлично:

А вообще у меня в карточке товаров размер полного изображения 800x800px. И я заранее исходники уже по такому размеру нарезаю.

 

Вот результат страницы в гугле с этим файлом:

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fmagazin-magii.ru%2Foberegi-dlja-doma%2Ftureckij-glaz%2Fsinjaja-podkova.html&tab=desktop

Кеш фото чистил, кеш системы тоже, обновил модификаторы после заливки вашего файла в директорию /system/library/

У меня тоже последние фотографии подогнаны под 800*800 как и размер увеличенного на странице товара.

Результат не улучшился:(

[20strannik08]

А до какого порога качества сжаты эти картинки? Мои весят по 140кб после того как я в редакторе Gimp я выставляю уровень сжатия 90% (4:4:4 наилучшее качество цветности, DTC целое).

 

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

 

А так в файле данном - На 40-й строчке есть цифра "85"

    public function save($file, $quality = 85) {

Можно с этой цифрой поиграться попробовать.

 

UPD. Перед отправкой на сайт, эти картинки я прогоняю через optimizilla.com - каким то образом это так же влияет на то какая картинка в магазине на выходе будет.

Змінено 30 квітня 2018 користувачем 20strannik08

[termotorg]

2 часа назад, 20strannik08 сказал:

А до какого порога качества сжаты эти картинки? Мои весят по 140кб после того как я в редакторе Gimp я выставляю уровень сжатия 90% (4:4:4 наилучшее качество цветности, DTC целое).

 

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

 

А так в файле данном - На 40-й строчке есть цифра "85"

    public function save($file, $quality = 85) {

Можно с этой цифрой поиграться попробовать.

 

UPD. Перед отправкой на сайт, эти картинки я прогоняю через optimizilla.com - каким то образом это так же влияет на то какая картинка в магазине на выходе будет.

Оригинальные собственно сделанные фото сжимаю до 20%, но качество остается приемлемым.

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

Змінено 30 квітня 2018 користувачем termotorg
уточнил

[20strannik08]

Нет там такой функции нет. Это только если дорабатывать. С другой стороны все равно при нарезке разных размеров - картинка будет пережиматься, от этого никуда не деться.

[termotorg]

48 минут назад, 20strannik08 сказал:

Нет там такой функции нет. Это только если дорабатывать. С другой стороны все равно при нарезке разных размеров - картинка будет пережиматься, от этого никуда не деться.

Спасибо за помощь!

[BestFish]

Доброго времени суток! У меня кешируются фото, как понимаю, для соц сетей с размером 600х315 и 200х200, нашел их в коде, см. ниже, подскажите где поменять размеры этих картинок? Заранее спасибо!

<meta property="og:image" content="https://sitename.com/image/cache/imagename-600x315.jpg" />
<meta property="og:image:width" content="600" />
<meta property="og:image:height" content="315" />

<meta name="twitter:image" content="https://sitename.com/image/cache/imagename-200x200.jpg" />
<meta name="twitter:image:width" content="200" />
<meta name="twitter:image:height" content="200" />

 

[Agatha65]

1 hour ago, BestFish said:

Доброго времени суток! У меня кешируются фото, как понимаю, для соц сетей с размером 600х315 и 200х200, нашел их в коде, см. ниже, подскажите где поменять размеры этих картинок? Заранее спасибо!

<meta property="og:image" content="https://sitename.com/image/cache/imagename-600x315.jpg" />
<meta property="og:image:width" content="600" />
<meta property="og:image:height" content="315" />

<meta name="twitter:image" content="https://sitename.com/image/cache/imagename-200x200.jpg" />
<meta name="twitter:image:width" content="200" />
<meta name="twitter:image:height" content="200" />

 

Размери етих картинок обезательние по документация Фейсбука.

Если картинка ниже 600х315, она отображается слево, если више сверху.

Минимальний размер для картинки 200х200.

Ви можете их сделать примерно 1200х630, но если у вас много товаров они будут занимат много места.

Sharing Best Practices for Websites - Optimize images to generate great previews

[BestFish]

1 hour ago, Agatha65 said:

Размери етих картинок обезательние по документация Фейсбука.

Если картинка ниже 600х315, она отображается слево, если више сверху.

Минимальний размер для картинки 200х200.

Ви можете их сделать примерно 1200х630, но если у вас много товаров они будут занимат много места.

Sharing Best Practices for Websites - Optimize images to generate great previews

 

Благодарю за ответ! Возможно сделать чтоб эти картинки не кешировались?

 

[chukcha]

9 минут назад, BestFish сказал:

Возможно сделать чтоб эти картинки не кешировались

Вы имеет ввиду про ссылку на исходник?
В принципе возможно