Можно ли как-либо оптимизировать изображение на фронте, с помощью js?

Question

[kavalorn123]

Можно ли как-либо оптимизировать изображение (значительное снижение веса картинки при неявной потере качества) на фронте, с помощью js?
если да то как и если нет то почему

Comments

[Lander]

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

Answer 1

[Stalker_RED]

Можно поместить изображение в canvas и ресайзнуть.
Есть и библиотеки для оптимизации и сжатия с потерями
https://github.com/brunobar79/J-I-C

Comments

[kavalorn123]

ага, уже нашел ) вот такой еще вариант https://github.com/xkeshi/image-compressor

Answer 2

[Oleg Dobrygin]

Никак, так как для сжатия используется полный пакет данных. Насколько я знаю, на лету ресайз и сжатие изображения невозможно осуществить.

Comments

[Владимир]

На лету, понятие растяжимое, вопрос в том ресайзить на вылете или на влете. Если человек хочет облегчить загрузку сайта, то сжимать нужно на вылете и это никак не фронт. А на влете какой смысл сжимать ?

[kavalorn123]

я по части бека не в курсе, там с этим какие-то трудности и эту задачу переложили на меня ) неужели нельзя как-то сжать картинку до отправки на сервер? скажем загнать её в инпут тайп=файл и что-то там с ней сделать ?)

[Oleg Dobrygin]

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

Answer 3

[DENIS Kokorev]

Такой пример нашел. https://jsfiddle.net/c6ko071p/38/
Здесь подробнее