CoDec JS

A pure TypeScript implementation of the CoDec Differential Image Compression algorithm (originally in C). This library provides tools to encode/decode images using a custom DIFF binary format with Variable Length Coding (VLC).

Installation

npm install codecjs

Usage

Svelte Component

This package exports a drop-in UI component to demonstrate the compression.

<script>
  import { CodecDemo } from 'codecjs';
</script>

<CodecDemo />

Core API

You can also use the low-level encoding/decoding functions.

import { encode, decode, imageDataToImgDif, imgDifToImageData } from 'codecjs';

// 1. Convert ImageData (from Canvas/Image) to ImgDif intermediate format
const imgDif = imageDataToImgDif(myImageData);

// 2. Encode to binary (Uint8Array)
const compressedBuffer = encode(imgDif);

// 3. Decode back to ImgDif
const decodedImgDif = decode(compressedBuffer);

// 4. Convert back to ImageData for display
const restoredImageData = imgDifToImageData(decodedImgDif);

Format Specification (DIFF)

The binary format consists of:

1. Magic Number (2 bytes): 0xD1FF (Gray) or 0xD3FF (RGB)
2. Dimensions (4 bytes): Width, Height
3. Quantizer Info (5 bytes): VLC Table metadata
4. Data:
   • First pixel of each layer is stored raw (divided by 2).
   • Subsequent pixels are stored as difference from previous neighbor.
   • Differences are folded (signed -> unsigned) and encoded using a static Huffman/VLC table.

Development

# Install dependencies
npm install

# Start dev server (Demo UI)
npm run dev

# Build library
npm run package