I built a JS image compressor that actually handles iPhone HEIC photos
If you've ever built a file upload feature, you've probably hit this: a user uploads a photo from their iPhone, and your app breaks. No preview, no compression, just a silent failure — because the file is .heic and browsers can't read it. HEIC is Apple's default photo format since iOS 11. Every iPhone photo taken today is HEIC. And virtually every JS image compression library just ignores the problem. I spent a weekend building PixSqueeze to fix that. The problem with HEIC in the browser Browsers use the <canvas> API to compress images. You draw the image onto a canvas, call canvas.toBlob() , and get a compressed file back. Clean, client-side, zero server cost. The problem: canvas.drawImage() only works if the browser can decode the image first. And no major browser can decode HEIC natively — not Chrome, not Firefox, not even Safari on macOS (Safari on iOS can, but that doesn't help your web app). So when a user picks a HEIC file, your image element fires onerror , your canvas stays blank, and your compression pipeline silently does nothing. The solution: server-side conversion, then client-side compression PixSqueeze handles this in two stages: Stage 1 — Server converts the format HEIC (and TIFF, camera RAW) files get sent to a small Express server. The server uses heic-convert running in a dedicated worker thread to convert to JPEG. Worker threads matter here — HEIC decoding is CPU-intensive WASM work, and running it on the main event loop would block every other request. Stage 2 — Client compresses the result The converted JPEG comes back to the browser, where the normal canvas-based compression pipeline takes over. Quality, resize, watermark hooks — all the usual options. The detection is important too. You can't just check file.type — iOS often sets HEIC files with an empty MIME type. PixSqueeze checks the ISO Base Media File Format magic bytes directly: async function isHeicFile ( file ) { const buffer = await file . slice ( 0 , 12 ). arrayBuffer (); const byt