How Browser-Based Image Compression Works

The idea

Many online image tools upload your file to a server, compress it there and let you download the result. That is simple for the provider, but it means that your pictures travel over the internet and sit on someone else's computer, at least for a while. Modern browsers can do the whole job locally, using features that were built for drawing and editing pictures in web pages. This tool is built on those features, which is why it needs no upload.

The page you load contains a small program written in JavaScript. When you choose images, the program reads them from your device, processes them in the memory of your browser and offers the results as downloads. There is no server in the middle that sees the files.

Step 1: Reading the file

When you choose a file, the browser gives the page a File object. The page does not send it anywhere; it only reads its bytes when needed. To decode a JPEG, PNG or WebP into pixels, the program uses the browser's own image decoder, through the createImageBitmap function or an ordinary image element. The decoder also reads the orientation tag, so that photos taken in portrait mode are upright.

At this point, the picture exists as a grid of pixels in memory. Metadata such as EXIF data is not part of this grid, and that is why it disappears in the next steps.

Step 2: Drawing on a canvas

The program creates a canvas element that is not shown on the page and draws the picture onto it at the target size. If you chose a maximum size, the canvas is smaller than the original, and the browser scales the image with a high-quality smoothing method. If you chose JPEG output, the canvas is first filled with white, so that transparent areas do not turn black.

Canvases have limits. Safari and other browsers on the iPhone cannot handle canvases above about 16.7 million pixels in total, so the tool scales larger images down to that size before drawing. Other browsers allow more, but the same limit is applied everywhere to give consistent results.

Step 3: Encoding

The canvas offers a function, toBlob, that encodes its content as an image file. You can ask for a type, such as image/jpeg or image/webp, and for a quality value between 0 and 1. The browser's built-in encoder creates the file. For PNG, the quality value is ignored, because PNG is lossless. Whether WebP can be created depends on the browser: some return a PNG instead when they cannot encode WebP, and the tool checks for this and hides the WebP option if it is not available.

The result is a Blob, a chunk of data in memory. The tool compares its size with the size of your original, and if the original was already smaller and nothing else changed, it keeps the original and marks it as already optimized.

Step 4: Downloading

To let you download a result, the page creates a temporary address for the Blob with URL.createObjectURL and attaches it to a link that has the download attribute. Clicking the link saves the file to your device. The address only works inside your browser and is released when you clear the list or close the page.

For the ZIP download, the tool builds the archive itself, in memory. Since JPEG, PNG and WebP are already compressed, the ZIP uses the simple stored method without further compression, which is fast and compatible with every unzip program.

What you can check yourself

Do not take privacy claims on trust. Open the developer tools of your browser, switch to the Network panel, and add some images. You will see no upload request: the only network traffic is the loading of the page itself and, depending on your location and consent choices, advertising. After the page has loaded, you can turn off your internet connection and the compressor should continue to work.

This is the fundamental difference to server-based tools: it is not a promise, it is how the program is built.

Limits of the approach

The browser's encoders are good but not the most advanced available. Specialized desktop tools can make PNG files smaller than a canvas can, can produce AVIF and can apply smarter JPEG optimization. This tool therefore concentrates on the large, easy savings: lower quality for JPEG and WebP, format conversion and resizing. It also rejects animated PNG and WebP files instead of flattening them to a single frame, and GIF is not supported.

Very large images can use a lot of memory, especially on phones. If the page becomes slow, process fewer pictures at a time. For everyday use, such as web photos, email and uploads, the browser's built-in tools are more than enough.

Where the data goes

It is worth saying what does not happen: the pictures are not sent anywhere. The processing happens with the memory and the processor of your own device, and the page does not contain code that transmits the images. When you close the page or press Clear all, the temporary data is released.

This also explains the limits that you see. The speed depends on your device, not on a server, and a phone will be slower than a desktop computer for a large batch. In return, there is no queue, no daily limit and no waiting for an upload.