Handling HEIC Uploads in Web Apps — Real-World Solutions

Source: Dev.to

Overview

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:

👉

This reduces support tickets and keeps your frontend clean.