Live data from Hacker News

JavaScript Image Compress Using HTML5 Canvas and File API Before Upload

phplift.net

11–14 of 14 posts

Re: JavaScript Image Compress Using HTML5 Canvas and File API Before Upload

#12

Database hugged to death :( Oh wait. It's a redirect to StackOverflow?! https://stackoverflow.com/questions/23945494/use-html5-to-re...

I have used JIC JavaScript Library to perform this task.

https://raw.githubusercontent.com/brunobar79/J-I-C/master/sr...

Re: JavaScript Image Compress Using HTML5 Canvas and File API Before Upload

#13

Database hugged to death :( Oh wait. It's a redirect to StackOverflow?! https://stackoverflow.com/questions/23945494/use-html5-to-re...

Squoosh is a much better demo of how to do in-browser compression (using optipng, mozjpeg, etc): https://github.com/GoogleChromeLabs/squoosh/ There are far more knobs you can tune whereas the native browser conversion only has mimetype and quality (via toBlob: https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasE... )

I really like Squoosh... I'm not sure if they have yet, but there was at one time discussion of separating the builds for the underlying wasm built libraries from squoosh whole, which would make it more usable for separate projects.

Re: JavaScript Image Compress Using HTML5 Canvas and File API Before Upload

#14

Earlier quoted context omitted.

Squoosh is a much better demo of how to do in-browser compression (using optipng, mozjpeg, etc): https://github.com/GoogleChromeLabs/squoosh/ There are far more knobs you can tune whereas the native browser conversion only has mimetype and quality (via toBlob: https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasE... )

I really like Squoosh... I'm not sure if they have yet, but there was at one time discussion of separating the builds for the underlying wasm built libraries from squoosh whole, which would make it more usable for separate projects.

Yea I wished it were easier to use out of the box too. The code is fortunately very well organized so you can just copy the pieces you need: https://github.com/GoogleChromeLabs/squoosh/tree/master/src/...

It also does make sense for you to pick and choose only the compression codecs you will need. Otherwise the cost of making every client download huge and unused wasm libraries might outweigh any bandwidth savings from compression.

Post reply on HN