Handling HEIC Uploads in Web Apps — Real-World Solutions

If your users upload photos from iPhones, you will absolutely encounter HEIC.

Option A: Decode HEIC client-side

Using a WASM decoder like libheif:
import HeifDecoder from "wasm-heif";

async function convertHEIC(file) {
const decoder = new HeifDecoder();
const image = await decoder.decode(file);
return image.toCanvas();
}

Works well, but the bundle size is usually huge.

Option B: Let the user convert before upload

Many apps choose this to avoid complexity.

A simple way is to recommend an easy conversion tool:
👉 https://heictopng.net

This reduces support tickets and keeps your frontend clean.