Image format methodology

The Image clusterconverts between PNG, JPG, and WebP using the browser’s native Canvas API. There’s no upload step, no server-side processing, and no third-party imaging service in the path — which has implications for both privacy and quality.

The conversion pipeline

1. The user picks a file via drag-and-drop or file picker.
2. The file is read as an ImageBitmap via createImageBitmap(file).
3. An offscreen canvas is created at the bitmap’s native dimensions.
4. The bitmap is drawn to the canvas.
5. The canvas is exported via canvas.toBlob(callback, mimeType, quality) — quality only applies to lossy targets.
6. The resulting Blob is offered as a download.

Every step runs in the browser. The file isn’t sent anywhere — there’s no fetch, no FormData, no XHR upload. The same applies to the Image to Base64 tool, which uses the FileReader API instead of canvas but follows the same browser-only principle.

Quality handling

Lossless → lossy (PNG/WebP → JPG)

Going from a lossless format to JPG, we expose a quality slider (default 0.85) that controls the JPG encoder’s quantisation aggressiveness. At 0.85 the file is typically 80-95% smaller than the source PNG with no perceptible visual difference for photographs. Below 0.7 artefacts become visible; we cap the lower bound at 0.5 to prevent accidentally producing visibly-degraded output.

Lossy → lossless (JPG → PNG)

Going from JPG to PNG doesn’t restore quality the JPG already discarded. The output is bit-perfect of what the JPG decoded into, but the JPG’s rounding losses are baked in. This is rarely useful in practice; the better path is to find a higher-quality source.

Lossy → lossy (JPG → WebP, etc.)

Each lossy save introduces new quantisation errors on top of the source’s existing ones. For files that have been through several saves already, this can cause visible compounding degradation. Always re-encode from the highest- quality source you have.

What we don’t handle

• HEIC / HEIF. Apple’s default since iOS 11. Browser support is essentially zero outside Apple’s ecosystem, so we’d need to bundle a 1+ MB decoder. Not worth it.
• RAW formats (DNG, CR2, NEF, ARW). Same problem — heavyweight decoders for low audience. Use Lightroom / darktable / RawTherapee.
• SVG ↔ raster. Possible via canvas, but vector → raster loses scalability and the reverse loses fidelity. Different conversation.
• Bulk batch conversion. Our UI handles one file at a time. For batch use the REST endpoint or a desktop tool.

Browser support floor

WebP encoding via canvas.toBlobrequires Chromium 23+, Firefox 65+, Safari 14+, Edge 79+. As of 2026 that’s >97% of global traffic. AVIF encoding is not supported in the browser canvas API; we’d need a WASM encoder to ship that target, which is roadmap material.