JavaScript Image Compress Using HTML5 Canvas and File API Before Upload

#1

Post by huzoorbux » Mon, Oct 14, 2019, 10:37 AM UTC

JavaScript Image Compress Using HTML5 Canvas and File API Before Upload
phplift.net

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

#2

Post by mcraiha » Mon, Oct 14, 2019, 2:00 PM UTC

There should be a law that says: "one shall not use var in JavaScript code examples"

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

#3

Post by accosine » Mon, Oct 14, 2019, 2:11 PM UTC

This can be done in like five lines of Javascript. Why does this even rank on HN?

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

#4

Post by untog » Mon, Oct 14, 2019, 2:17 PM UTC

accosine wrote: post #3

This can be done in like five lines of Javascript. Why does this even rank on HN?

What's the minimum number of lines before code becomes notable enough for HN?

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

#5

Post by ghostbrainalpha » Mon, Oct 14, 2019, 3:26 PM UTC

untog wrote: post #4

accosine wrote: post #3

This can be done in like five lines of Javascript. Why does this even rank on HN?

What's the minimum number of lines before code becomes notable enough for HN?

7 can be acceptable in some cases, but just to be safe I suggest 8 lines.

// 8 Lines not including sarcastic comments obviously.

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

#6

Post by yoz-y » Mon, Oct 14, 2019, 3:30 PM UTC

mcraiha wrote: post #2

There should be a law that says: "one shall not use var in JavaScript code examples"

Don't linters complain about it nowadays? Maybe devtools should start doing it too.

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

#7

Post by tmikaeld » Mon, Oct 14, 2019, 3:33 PM UTC

accosine wrote: post #3

This can be done in like five lines of Javascript. Why does this even rank on HN?

There might not be that many that know about it?

Image-conversion is the library I've used the most, since you can target file-size || quality:

https://github.com/WangYuLue/image-conversion

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

#8

Post by raxor53 » Mon, Oct 14, 2019, 3:35 PM UTC

ghostbrainalpha wrote: post #5

untog wrote: post #4

Earlier quoted context omitted.

What's the minimum number of lines before code becomes notable enough for HN?

7 can be acceptable in some cases, but just to be safe I suggest 8 lines. // 8 Lines not including sarcastic comments obviously.

These are the new standards, please send out a memo.

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

#9

Post by Piskvorrr » Mon, Oct 14, 2019, 3:37 PM UTC

Database hugged to death :(

Oh wait. It's a redirect to StackOverflow?!

https://stackoverflow.com/questions/23945494/use-html5-to-re...

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

#10

Post by throwaway_bad » Mon, Oct 14, 2019, 4:02 PM UTC

Piskvorrr wrote: post #9

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...)