Hacker News new | ask | show | jobs
by Klathmon 2987 days ago
Wouldn't that be pretty trivial with just a <canvas> element?

use the `drawImage` function to draw the image scaled to whatever size you want, then just call any of the APIs that you want to get either ImageData, a base64-encoded-URI, or a PNG Blob resized.

The exact method of resize is up to the useragent (IIRC i could be wrong on this), and it's done in "native" code, not in javascript.

1 comments

png would be huge (since it is lossless) and jpg would incur double compression (source jpg and re-compressed from canvas) losing quality.
Is there any solution other than those 2 options?

Any resizing of a jpg to another jpg is going to incur double compression isn't it? Sure there are ways of mitigating it using various sampling and resizing algorithms, but it's not going to be perfect, and there is no "one-size-fits-all" best algorithm.

What would a "browser API" provide that you can't already get with canvas?The only thing I can think of is customizable resize algorithms, but I'd rather have the option to change that for a canvas, rather than a specific "resize this image API".