Resize a photo to 1920 pixels wide

How it works

How it is done

1. Read the first bytes of the chosen file and work out from them alone whether it is a PNG, a JPEG, a WebP or a GIF, and how many pixels it claims to contain. The file's declared type is not consulted, because Safari reports a HEIC with no type at all.
2. Refuse anything above 80 megapixels here, before allocating a byte. A decoded image costs four bytes a pixel whatever the file size, so a 100-megapixel panorama is 400 MB of memory that a browser tab does not have.
3. Decode the image with the browser's own decoder, asking explicitly for the EXIF orientation to be applied, so a photo shot in portrait is measured the way it looks rather than the way the sensor recorded it.
4. Work out one scale factor from the decoded dimensions and multiply both sides by it, rounding each to a whole pixel. Only the exact-size mode uses two factors, and only because it has been told to ignore the proportions.
5. Halve the image repeatedly until one more halving would overshoot, then draw the last step straight to the target. A browser resamples with a small kernel, so a single 10x reduction samples about one pixel in ten and throws the rest away.
6. Fill the canvas with the matte colour first when the output is JPEG, because JPEG has no alpha channel and a transparent pixel has to become something.
7. Encode the final canvas as PNG or JPEG, read back the type the browser says it actually wrote, and offer it as a download named after the original with the new dimensions appended.

What it assumes

• Both sides are scaled by one factor and then rounded to whole pixels, so the proportions can shift by up to half a pixel. On a 4000-pixel photo that is a change of about 0.01%, and it is the only way to avoid a much larger drift from rounding the two sides independently.
• EXIF orientation is applied. A photo whose file header says 4000 by 3000 but which carries a quarter-turn tag is treated as 3000 by 4000, because that is what you see in your photo viewer and what every dimension below it has to agree with.
• The toggle called "Never make it bigger" applies to the box, width and height modes, which describe a target the image must fit inside. A percentage or an exact size is taken literally, so 200% does enlarge.
• Only the first frame of an animated GIF or WebP survives. A canvas holds one frame, and re-assembling an animation would need an encoder the browser does not expose.
• An embedded colour profile is usually dropped. Most engines convert a wide-gamut photo to sRGB when it is drawn to a canvas, so an Adobe RGB image can come back looking slightly flatter than the original.
• A JPEG is decoded and re-encoded, never copied. Even at 100% quality that loses a little more detail, which is why "keep the original format" writes a WebP or a GIF out as lossless PNG rather than as JPEG.
• KB means 1,024 bytes and MB means 1,024 KB, which is what a desktop file manager shows and therefore what the figure gets compared against.