I replaced server-side image compression with 40 lines of Canvas API code

I was building a side project that needed image compression. My first instinct was to look for an API — TinyPNG, Cloudinary, something with a POST endpoint. Then I looked at the pricing. And the rate limits. And the fact that I’d be uploading user photos to someone else’s infrastructure. So I tried something different: what if the browser just… did it? Turns out the Canvas API can compress images surprisingly well. The core logic is about 40 lines: const fallbacks = [0.6, 0.45, 0.3, 0.2]; let bl