DEV Community

Max
Max

Posted on

Why I Stopped Uploading Images to Compression Services (And Built a Browser-Only Alternative)

The Problem

Every web developer has been there: you need to compress images for a client project, so you drag them to TinyPNG or some random compression site.

But then you pause. These are mockups with unreleased branding. Or screenshots with sensitive data. Or client photos under NDA.

Do you really want to upload them to a third-party server?

I started thinking about this more seriously after GDPR enforcement got real. If you're processing client images through external services, that's technically data processing you need to account for.

The Browser Can Do This Now

Modern browsers ship with Canvas API, OffscreenCanvas, and WebAssembly support that makes client-side image processing genuinely fast. We're not talking about the janky Canvas-based compression from 2015 — WASM codecs for WebP and AVIF run at near-native speed now.

The key insight: your browser is already an image processing engine. It decodes every image you view. Why upload somewhere else just to re-encode it smaller?

What I Built

I made QuickShrink — a free image compressor that runs 100% in your browser:

  • Drag and drop (or paste from clipboard)
  • Images never leave your machine
  • No accounts, no limits, no upsells
  • Handles PNG, JPEG, WebP
  • Batch processing supported

The entire thing is static HTML/JS. You could literally save the page and run it offline.

Technical Approach

The compression pipeline:

  1. Read file as ArrayBuffer
  2. Decode to ImageBitmap (hardware-accelerated)
  3. Draw to OffscreenCanvas at target quality
  4. Export as compressed blob
  5. Trigger download

For most photos, you get 60-80% size reduction at quality 0.8 with zero perceptible difference. For PNGs with transparency, re-encoding as WebP typically saves 40-60%.

When You Should Still Use Server-Side

To be fair, client-side isn't always the answer:

  • Build pipelines: Use Sharp/libvips in your CI for automated optimization
  • CDN transforms: Cloudflare/Imgix handle format negotiation per-device
  • Bulk processing: 10,000 images? Use a proper batch tool

But for the everyday "I need to shrink these 5 screenshots before adding them to the README" — a browser tool is faster and more private than any upload-based service.

Try It

quickshrink.orthogonal.info — open source, free forever, no tracking.

Would love feedback from folks who've built similar tools. What codecs are you using? Anyone gotten JPEG XL working reliably in-browser yet?


If you found this useful, I write about web performance and developer tools at orthogonal.info.

Top comments (0)