Перейти к публикации
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...

Вопрос оптимизации изображений GD


ndnn
 Поделиться

Рекомендованные сообщения

Всем привет, из чего состоит мой вопрос:

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

1. Исходник который залит на сайт весит 120 Кб, а тот файл который отображается на сайте весит примерно 450 Кб.

2. То же самое если файл который залит весит 1 Мб, то на выхлопе он так же преобразуется в 450 Кб

3. К примеру если добавлено 7 изображений на товар вес страницы получается примерно 3,1 Мб

Я так понимаю что штатный графический обработчик по моему GD не очень корректно обрабатывает эти изображения, как решить эту проблему?

Нужно решение что бы страницы товара на сайте не набирала вес при добавлении изображений

ПРИМЕР СТРАНИЦЫ

Есть идеи?

Спс!

Ссылка на комментарий
Поделиться на других сайтах


Можно немного поправить файл catalog/model/tool/image.php. Найдите в нём строчку

$image->save(DIR_IMAGE . $new_image);

И замените на что-нибудь вроде:

$image->save(DIR_IMAGE . $new_image, 75);

В библиотеке Image опенкарта поддержка качества сжатия при сохранении есть, но модель ToolImage её не использует при создании кэшированной версии картинки с определённными размерами. В библиотеке Image по-умолчанию сжатие установлено в 90, поэтому картинки получаются (по объёму файла) больше, чем могли бы быть без сильно заметной потери качества.

  • +1 1
Ссылка на комментарий
Поделиться на других сайтах


Привет, спасибо за ответ, вот попробовал так:

 
$image = new Image(DIR_IMAGE . $old_image);
if ($directory == $excepts){
$image = new Image(DIR_IMAGE . $old_image);
$image->resize($width, $height);
$image->save(DIR_IMAGE . $new_image, 75);
}else{
if ($extopt == 'on'){
$image->watermark(DIR_IMAGE . $wat, $pos);
$image->rotate($imgrotate);
$image->text($wtext, $scalex, $scaley, 100, $textcolor);
$image->resize($width, $height);
$image->save(DIR_IMAGE . $new_image, 75);
}else{
$image->watermark(DIR_IMAGE . $wat, $pos);
$image->resize($width, $height);

 

$image->save(DIR_IMAGE . $new_image, 75);

 

Но результата почему то нет...

Что еще можно изменить?

Спс.

 

Можно немного поправить файл catalog/model/tool/image.php. Найдите в нём строчку

$image->save(DIR_IMAGE . $new_image);

И замените на что-нибудь вроде:

$image->save(DIR_IMAGE . $new_image, 75);

В библиотеке Image опенкарта поддержка качества сжатия при сохранении есть, но модель ToolImage её не использует при создании кэшированной версии картинки с определённными размерами. В библиотеке Image по-умолчанию сжатие установлено в 90, поэтому картинки получаются (по объёму файла) больше, чем могли бы быть без сильно заметной потери качества.

Ссылка на комментарий
Поделиться на других сайтах


Кэш ещё нужно чистить. Потому что у вас в кэше уже есть эти файлы, но с качеством 90. А так как они уже есть, Opencart не будет для них новые версии генерировать с качеством 75 — он просто будет брать те, которые сгенерировались ещё до того, как вы принудительно задавали качество 75.

Ссылка на комментарий
Поделиться на других сайтах


Кэш я сразу почистил, и несколько раз, все размеры изображений по объему как были так и остались даже в кэше

 

Кэш ещё нужно чистить. Потому что у вас в кэше уже есть эти файлы, но с качеством 90. А так как они уже есть, Opencart не будет для них новые версии генерировать с качеством 75.

Ссылка на комментарий
Поделиться на других сайтах


Странно, но у меня изображения по той ссылке, которую вы опубликовали, стали меньше. В среднем, одна картинка — 100 с лишним килобайт. К тому же, эти большие версии картинок загружаются не вместе со страницей, а только в момент, когда открывается окно со слайдером больших картинок. В момент загрузки страницы с товаром они не загружаются.

Ссылка на комментарий
Поделиться на других сайтах


Да! Открыв в другом браузере были новые размеры!

На самом деле обновились, не смотря на что очищал кэш папки (image/cache) так же кэш браузера гугл хрома, он так и оставил в том виде как и были ранее, и перезапустив FTP клиент он тоже показал все размеры ниже!

Спасибо огромное Вы мне очень помогли, ставлю +

 

 

Странно, но у меня изображения по той ссылке, которую вы опубликовали, стали меньше. В среднем, одна картинка — 100 с лишним килобайт. К тому же, эти большие версии картинок загружаются не вместе со страницей, а только в момент, когда открывается окно со слайдером больших картинок. В момент загрузки страницы с товаром они не загружаются.

Ссылка на комментарий
Поделиться на других сайтах


  • 2 месяца спустя...

Установка степени сжатия на .png файлы не влияет. Меньшего размера становятся только .jpg картинки. Есть еще способ чтоб создавались картинки в кэше размера не больше чем оригинал?

Ссылка на комментарий
Поделиться на других сайтах


Речь идет как раз о jpg, а не png. (Есть еще способ чтоб создавались картинки в кэше размера не больше чем оригинал?) Это и есть ответ на Ваш вопрос, с этим как раз в этой теме  решалось и решилось!

 

Установка степени сжатия на .png файлы не влияет. Меньшего размера становятся только .jpg картинки. Есть еще способ чтоб создавались картинки в кэше размера не больше чем оригинал?

Ссылка на комментарий
Поделиться на других сайтах


Возможно речь шла о .jpg файлах, но в самом первом запросе об этом ничего не сказано. У меня .png картинка размером 6кб превращается в 80кб что сильно сказывается на загрузке страницы когда таких картинок много. Решения по .png файлам не нашел и решил спросить с похожей теме. Я не сторонник создания отдельной темы по .jpg и по .png картинкам, но если автор против моих постов сюда могу и отдельную тему создать.

Ссылка на комментарий
Поделиться на других сайтах


Никто против ничего не имеет, а коэффициенты сжатия для PNG работают так же как и для JPG

 

Возможно речь шла о .jpg файлах, но в самом первом запросе об этом ничего не сказано. У меня .png картинка размером 6кб превращается в 80кб что сильно сказывается на загрузке страницы когда таких картинок много. Решения по .png файлам не нашел и решил спросить с похожей теме. Я не сторонник создания отдельной темы по .jpg и по .png картинкам, но если автор против моих постов сюда могу и отдельную тему создать.

Ссылка на комментарий
Поделиться на других сайтах


Насколько я вижу из исходников, опенкартовкая библиотека сохраняет все PNG-картинки с качеством ноль. Для GDLib, ноль в PNG — это значит без сжатия.

 

/system/library/image.php:

public function save($file, $quality = 90) {
    $info = pathinfo($file);

    $extension = strtolower($info['extension']);

    if ($extension == 'jpeg' || $extension == 'jpg') {
        imagejpeg($this->image, $file, $quality);
    } elseif($extension == 'png') {
        imagepng($this->image, $file, 0);
    } elseif($extension == 'gif') {
        imagegif($this->image, $file);
    }

    imagedestroy($this->image);
}

Как видно из строки №46, опенкарту совершенно по барабану на то, какое качество сжатия указывалось при сохранении картинки в PNG-формат. Он всё равно будет использовать 0 (без сжатия). Чтобы добавить поддержку сжатия PNG, я бы поправил этот файл примерно так (см. строки 46-47):

 

public function save($file, $quality = 90) {
    $info = pathinfo($file);

    $extension = strtolower($info['extension']);

    if ($extension == 'jpeg' || $extension == 'jpg') {
        imagejpeg($this->image, $file, $quality);
    } elseif($extension == 'png') {
        $quality = round((100-$quality)/10) > 9 ? 9 : round((100-$quality)/10);
        imagepng($this->image, $file, $quality);
    } elseif($extension == 'gif') {
        imagegif($this->image, $file);
    }

    imagedestroy($this->image);
}

 

В GDLib (при сохранении PNG) качество указывается от 0 (без сжатия) до 9 (максимальное сжатие). Так что round((100-$quality)/10) даст примерно подходящее по смыслу значение.

Ссылка на комментарий
Поделиться на других сайтах


Интересный вопрос, если учесть, что у GIF-файлов вообще нет такого понятия, как «регулируемый уровень сжатия».

Ссылка на комментарий
Поделиться на других сайтах


Насколько я вижу из исходников, опенкартовкая библиотека сохраняет все PNG-картинки с качеством ноль. Для GDLib, ноль в PNG — это значит без сжатия.

 

/system/library/image.php:





public function save($file, $quality = 90) {
    $info = pathinfo($file);

    $extension = strtolower($info['extension']);

    if ($extension == 'jpeg' || $extension == 'jpg') {
        imagejpeg($this->image, $file, $quality);
    } elseif($extension == 'png') {
        imagepng($this->image, $file, 0);
    } elseif($extension == 'gif') {
        imagegif($this->image, $file);
    }

    imagedestroy($this->image);
}

Как видно из строки №46, опенкарту совершенно по барабану на то, какое качество сжатия указывалось при сохранении картинки в PNG-формат. Он всё равно будет использовать 0 (без сжатия). Чтобы добавить поддержку сжатия PNG, я бы поправил этот файл примерно так (см. строки 46-47):

 





public function save($file, $quality = 90) {
    $info = pathinfo($file);

    $extension = strtolower($info['extension']);

    if ($extension == 'jpeg' || $extension == 'jpg') {
        imagejpeg($this->image, $file, $quality);
    } elseif($extension == 'png') {
        $quality = round((100-$quality)/10) > 9 ? 9 : round((100-$quality)/10);
        imagepng($this->image, $file, $quality);
    } elseif($extension == 'gif') {
        imagegif($this->image, $file);
    }

    imagedestroy($this->image);
}

 

В GDLib (при сохранении PNG) качество указывается от 0 (без сжатия) до 9 (максимальное сжатие). Так что round((100-$quality)/10) даст примерно подходящее по смыслу значение.

 

У меня тоже проблема с png , заливаю в магазин оптимизированные пнгешки весом 50 кб , в кеше они получаются по 150 кб а после Вашей доработки вообще 488 кб 

теперь вернул как было 

подскажите плиз что поправить , версия ocstor 1.5.4.1

Ссылка на комментарий
Поделиться на других сайтах


У меня тоже проблема с png , заливаю в магазин оптимизированные пнгешки весом 50 кб , в кеше они получаются по 150 кб а после Вашей доработки вообще 488 кб

теперь вернул как было

подскажите плиз что поправить , версия ocstor 1.5.4.1

Вы просто сообщение #2 пропустили. Сообщение #15 — это дополнение ко второму сообщению, а не отдельная настройка. Если вы не будете править файл catalog/model/tool/image.php, то у вас для всех картинок по-умолчанию будет практически максимальное качество и огромный размер. Не только для PNG, но и для JPG.

Ссылка на комментарий
Поделиться на других сайтах


Добрый день, ребят подскажите пожалуйста!

Сайт уже готов начали наполнять и столкнулись с проблемой выгрузки фото. Их оч много и они все разного размера и соответственна веса - есть ли какой-нить плагин или доп модуль с помощью которого можно обработать фотографии что бы их загружать на сайт уже в нужном размере и уменьшенном весе ?? Заранее спасибо!!

Ссылка на комментарий
Поделиться на других сайтах


Только на компе можно обработать (размер / сжатие) и залить уже готовый вариант на хостинг

http://sbgames.su/imagecompression-sb-paketnoe-szhatie-izobrazhenij/ - это поможет!

http://sbgames.su/imagecompression-sb-paketnoe-szhatie-izobrazhenij/

Добрый день, ребят подскажите пожалуйста!

Сайт уже готов начали наполнять и столкнулись с проблемой выгрузки фото. Их оч много и они все разного размера и соответственна веса - есть ли какой-нить плагин или доп модуль с помощью которого можно обработать фотографии что бы их загружать на сайт уже в нужном размере и уменьшенном весе ?? Заранее спасибо!!

Ссылка на комментарий
Поделиться на других сайтах


Только на компе можно обработать (размер / сжатие) и залить уже готовый вариант на хостинг

http://sbgames.su/imagecompression-sb-paketnoe-szhatie-izobrazhenij/ - это поможет!

http://sbgames.su/imagecompression-sb-paketnoe-szhatie-izobrazhenij/

а возможно можно внести какие либо правки в код что бы было не критичны расхождения в размере фото н-р что бы высота одинаковая у всех была, а ширину он сам подгонял или урезал как ему нужно? 

Ссылка на комментарий
Поделиться на других сайтах


  • 2 недели спустя...

спасибо за подсказки

пользуюсь ocstore 2 года, смешно, но только вчера занялся оптимизацией картинок

с помощью RIOT все пожал без потери, все картинки PNG 600х600 - максимальный размер для сайта, залил, кеш очистил

и увидел то же, что и все в этой теме - увеличение веса 600х600 в 80 раз!

скажите, если я подготовил изображения в максимальном разрешении для сайта 600х600,

можно сделать, чтобы движок их вообще не "трогал" и выводил как есть?

просто фраза "И замените на что-нибудь вроде: 75" намекает на подбор значений

и еще вопрос

глубина цвета - мне достаточно 256 (8) , я их так и залил, а движок , как я понял сохраняет в кеше в 32

в общем как сделать так, чтобы движок не "усложнял" ?

Ссылка на комментарий
Поделиться на других сайтах


Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас
 Поделиться

×
×
  • Создать...

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.