Decoding iPhone HEIC images in the browser with WebAssembly (no server, no uploads)
Every "free HEIC converter" website I found had the same privacy model: upload your photos to my server, wait, download the result. Family photos. Screenshots. Whatever was in your camera roll. I didn't want my files on someone else's disk, and I doubted other people wanted theirs on mine either. So I spent a while teaching the browser to do it locally instead. This post is about how the decoding…
A web-based tool called SnappyKit allows users to convert HEIC images to JPG, PNG, WebP, or AVIF formats directly in their browser without any server-side processing or file uploads. This is achieved by leveraging the libheif library, which has been integrated into WebAssembly (WASM), enabling the decoding to happen locally within the user's browser.
The HEIF image format, which supports high-quality photography, is decoded using libheif-js/wasm-bundle, a WASM module that wraps the libheif library. The API for the decoder is kept minimal, consisting of a HeifImage interface for accessing image dimensions, displaying the image data, and freeing the memory allocated for the image.
To ensure a smooth user experience, the HEIC decoder is lazy-loaded only when needed, using a promise to load the WASM module and caching it to prevent race conditions when multiple conversions are performed simultaneously. All allocated memory for the decoded images must be explicitly freed using the free() function to avoid memory leaks.
The website employs a strict Content Security Policy (CSP) to enhance security. The WASM-related security requirement, wasm-unsafe-eval, is added per-route in the Next.js configuration to maintain a strict policy for the majority of the site. A similar approach is taken for the bundle's bundler quirks, ensuring that the CommonJS files within the WASM package are treated properly by webpack, preventing critical dependency errors.
The converter also includes safeguards to protect users' privacy and device security. It rejects any image exceeding 100 megapixels or 16000 pixels per side, limiting the pixel work to prevent potential performance issues. Additionally, decode failures result in a user-friendly message instead of exposing raw error information, maintaining the privacy of users' files.
The website also performs automated tests to ensure that no image uploads or external-origin requests are made during the conversion process, guaranteeing that users' photos remain on their devices at all times.
Written by urgent.news from Dev.to's reporting — not their text. Machine-written — may contain errors; check the original before relying on it.
