Technical Methodology & Architecture
An inside look at how client-side WebAssembly image processing works.
1. Overview of Client-Side WebAssembly Processing
Traditional image conversion websites transmit uploaded image binaries over HTTP to remote server clusters, where server-side binaries (such as ImageMagick or FFmpeg) decode and convert the images before returning the result. HEIC.dev uses a client-side architecture where the conversion binaries run directly inside your web browser via WebAssembly (Wasm) and HTML5 Canvas APIs.
2. HEIF Decoding Pipeline
HEIF (High Efficiency Image File Format) containers encode static image items using the HEVC (H.265) video coding standard. Browsers outside of Safari lack native decoding support for HEVC image items in standard HTML <img> elements.
To overcome this limitation, HEIC.dev loads a WebAssembly module compiled from open-source C/C++ libraries (such as libheif). When a user selects a .heic or .heif file:
- The File API reads the raw ArrayBuffer from local disk into browser memory.
- The WebAssembly module parses the ISO base media file format (ISOBMFF) container and decodes the primary image item into raw RGBA pixel data.
- The RGBA buffer is transferred to an HTML5 Canvas context or rendered via Web Workers.
3. Target Format Encoding & Metadata Handling
Once raw pixels reside in memory, target encoders construct the output file:
- JPG / JPEG: Encoded using canvas JPEG export at customizable quality values (e.g. 85% default). Supported EXIF/GPS tags are extracted from the source container and injected into the JPEG APP1 segment.
- PNG: Encoded losslessly to preserve pixel values and alpha channel transparency.
- WebP & AVIF: Encoded using browser-native or Wasm codecs for optimal web compression efficiency.
- PDF: Page layouts are synthesized locally, embedding converted image payloads without server communication.
4. Privacy & Data Security Boundary
The boundary between user data and network activity is strictly defined:
- Image Payload: Selected image files stay inside browser memory and are never sent to a conversion backend.
- Site Traffic: Standard web requests fetch HTML/CSS/WASM assets, log technical HTTP request headers (IP/User-Agent), and load analytics/advertising scripts.