ifslib

ifslib is a standalone WebAssembly library for parsing and rendering fractals described in the AIFS language. It powers every fractal canvas on this site. Embed it in any web page, Node.js script, or WASM-capable environment — no dependencies, no bundler required. For analytics (Hausdorff dimension, neighbor graph, boundary IFS generation), see the Advanced API →

Download

The WASM binary is served alongside this site and is part of the open-source repository:

• ifslib.wasm — download raw from GitHub
• ifslib-worker.js — reference Web Worker implementation (progressive + multi-canvas)

Instantiation

ifslib is a WASI reactor with zero imports. Pass an empty imports object and call _initialize() once:

const resp = await fetch('ifslib.wasm');
const buf  = await resp.arrayBuffer();
const { instance } = await WebAssembly.instantiate(buf, {});  // no imports needed
const wasm = instance.exports;
wasm._initialize();  // must call once after instantiation

For repeated renders, compile the module once and instantiate a fresh copy per render (ifslib has a single global renderer per instance):

const mod = await WebAssembly.compile(buf);  // compile once, cache
// later:
const { exports: wasm } = await WebAssembly.instantiate(mod, {});
wasm._initialize();

API Reference

Memory helpers

ifslib uses a C string ABI. Use malloc / free from the exports, and the memory export to read/write bytes:

function writeCString(wasm, str) {
  const bytes = new TextEncoder().encode(str + '\0');
  const ptr = wasm.malloc(bytes.length);
  new Uint8Array(wasm.memory.buffer).set(bytes, ptr);
  return ptr;              // caller must free()
}

function readCString(wasm, ptr) {
  if (!ptr) return '';
  const mem = new Uint8Array(wasm.memory.buffer);
  let end = ptr;
  while (mem[end] !== 0) end++;
  return new TextDecoder().decode(mem.subarray(ptr, end));
}

Core rendering pipeline

For analytics functions — Hausdorff dimension, attractor metrics, neighbor graph, and boundary IFS — see the Advanced API.

Minimal Example

Render a 256×256 Sierpiński triangle and draw it onto a <canvas>:

const aifs = `@
$dim=2
f1=[0.5,0,0,0.5]
f2=[0.5,0]*[0.5,0,0,0.5]
f3=[0.25,0.5]*[0.5,0,0,0.5]
S=(f1|f2|f3)*S`;

const resp = await fetch('ifslib.wasm');
const { instance } = await WebAssembly.instantiate(await resp.arrayBuffer(), {});
const wasm = instance.exports;
wasm._initialize();

// write AIFS source into WASM memory
const bytes = new TextEncoder().encode(aifs + '\0');
const ptr = wasm.malloc(bytes.length);
new Uint8Array(wasm.memory.buffer).set(bytes, ptr);

if (!wasm.init(ptr)) throw new Error(readCString(wasm, wasm.get_last_output()));
wasm.free(ptr);

// pass -1 to select the first non-hidden block
if (!wasm.set_block(-1)) throw new Error('set_block failed');

const W = 256, H = 256;
const pixPtr = wasm.render(W, H, 2, 1);  // quality=2, thickness=1
if (!pixPtr) throw new Error('render failed');

const rgba = new Uint8ClampedArray(wasm.memory.buffer, pixPtr, W * H * 4);
const canvas = document.querySelector('canvas');
canvas.width = W; canvas.height = H;
canvas.getContext('2d').putImageData(new ImageData(rgba, W, H), 0, 0);

Note: to select the default block, pass −1 to wasm.set_block(-1). To select by block ID, call get_block_idx(ptr) first to get the index, then pass it to set_block(idx). set_root is only needed when you want a specific root set other than the block default. Both functions can be called repeatedly to switch blocks/roots without reinitialising.

Using in a Web Worker

For non-blocking rendering (required for large canvases), run ifslib inside a Web Worker. The reference implementation used by this site supports:

• Progressive rendering (32 → 64 → … → final size) with early preview
• Multiple canvases rendered concurrently in round-robin
• Cancel support (leaves viewport → stops rendering)
• Module caching (compiled once, re-instantiated cheap per render)

See ifslib-worker.js for the full implementation.

Using in Node.js

import { readFile } from 'node:fs/promises';

const buf = await readFile('ifslib.wasm');
const { instance } = await WebAssembly.instantiate(buf, {});
const wasm = instance.exports;
wasm._initialize();
// ... same API as browser

Tested on Node.js 18+. No WASI polyfills needed — the binary has no external imports.

Embedding on Your Own Site

1. Copy ifslib.wasm (and optionally ifslib-worker.js) into your public/ (or static assets) directory.
2. Serve the WASM file with the correct MIME type: application/wasm. Most static hosts (GitHub Pages, Netlify, Vercel, Cloudflare Pages) do this automatically.
3. ifslib does not use SharedArrayBuffer and has no cross-origin isolation requirements. No special response headers are needed.

License

ifslib.wasm is the computational core of the IFStile project, created by Dmitry Mekhontsev and distributed under the GNU Lesser General Public License v3 (LGPL-3.0). This means you can embed it in projects under any license (open-source or proprietary) without affecting your code, as long as modifications to ifslib itself remain open-source.