Why server-based services have limits — and we don't
"Maximum 20 images", "only 5 MB per file" — limits like these are familiar from online services. The reason is economic: every uploaded image costs the provider bandwidth and compute time on the server, and both have to be capped. With us, the processing runs on your device — which is why the 50th image costs us exactly as much as the first: nothing. There's simply no reason for a limit. Why it's built this way in the first place is covered in the workshop post on the browser-local architecture.
Step 1: accepting many files
It starts with the drop zone. It accepts not just one file but a whole selection — whether via drag-and-drop of multiple files or through the file dialog. Technically, a FileList comes in, which we turn into a regular array so we can iterate over it comfortably:
const files = Array.from(fileList);From here on, the batch is simply a list we work through. Invalid types (say, a PDF in an image batch) get filtered out right away.
Step 2: processing one after another
Every image goes through the same chain as a single image: read it in, draw it onto a canvas, re-encode it at the target size and quality. We process the images one after another, not all at once — that keeps memory usage in check. While it's being processed, an image occupies a multiple of its file size in memory (a 4 MB JPG unpacks into many megabytes of raw pixels). Fifty of those in parallel would overwhelm weaker devices; one at a time, each one stays manageable, and a progress bar shows where the batch currently stands.
Step 3: packing everything into one ZIP
Fifty individual download dialogs would be an imposition. So we collect the finished images and pack them into a single ZIP archive — and we do it in the browser, with a JavaScript ZIP library, without a server ever being involved. The ZIP is built in memory, offered as one single download, and the user gets all the results bundled together in one place. The same technique also produces the icon package of the PWA generator.
The one real limit
Honesty is honesty: there is one limit after all — your device's memory. On a powerful computer, hundreds of images are no problem; an older smartphone can hit its ceiling with very large batches of very large images, because a browser tab only gets a limited amount of memory. But that's a device limit, not an artificially imposed one — and it sits far above anything everyday use throws at it. If you're processing 500 photos in one go, you split them into two batches if in doubt; with the usual ten to fifty images you won't notice a thing.
Why this is more than convenience
Batch processing isn't just a comfort feature. It's the practical consequence of the fundamental decision: because no server is involved, limits, waiting queues, and upload times disappear. Fifty images take as long to compress as your device needs to do the math — and not a second longer for uploading. That's the difference you only come to appreciate once you've shrunk an entire vacation folder in one go.