Five ways to draw the same fractal

The fractal designer has been sitting on this site for a while as a single canvas with a single way of drawing on it. It now has five, and a renderer dropdown to pick between them, and a Save PNG button that hands you the frame without the control gizmos painted over it.

The five are Chaos CPU, Chaos WebGL2, Collage CPU, Collage GPU, and Escape GPU. They are five genuinely different algorithms, not five styles, and the interesting thing about having them side by side is that they all have to agree. Every one of them is drawing the attractor of the same handful of affine maps. If two of them disagree, at least one is lying, and there is no way to tell which by looking at a single pretty picture in isolation.

That turned out to matter more than I expected. When I lined the five up and counted lit pixels, three of them disagreed. The chaos game said the attractor covered about 28,700 pixels. Collage CPU said zero, because it faded to black after a few seconds. Collage GPU said 257,741, a filled blob nine times too big. Two renderers, two opposite failures, both of which had been sitting there looking plausible enough on their own.

The workspace is also no longer square. It was hardcoded to a 900×900 canvas, with the world extent baked to match, so widening the browser stretched the fractal. The viewport now derives its world-space extent from the canvas aspect ratio, and hit-testing scales each axis independently, so you can drag a point across a wide window and it goes where you put it.

Save PNG turned out to be the easy part. The control gizmos live on a separate overlay canvas stacked on top of the render canvas, which means exporting the render canvas alone already gives you a clean frame. No hiding, no re-render, no second compositing pass. Both WebGL contexts already asked for preserveDrawingBuffer, so the readback works in the GPU modes too. Files come out named for the renderer and the moment, like fractal-chaos-cpu-2026-07-09T03-55-42.png. Every figure in this series was made with it.

There is also one control that used to exist and now does not. The collage modes had a Hold slider, which multiplied the whole image by 0.997 on every frame. It read like a trail control. What it actually did was decay the attractor — the invariant set, the thing you came to look at — toward zero on every single frame, while clearing nothing, because outside the image of the maps the value is already zero. It could only ever destroy signal. It’s gone.

What follows is a short series working through the pieces. First, what an affine IFS actually is, which is the shared object all five renderers are chasing and is a good deal simpler than the pictures suggest. Then one article per algorithm: the chaos game, which throws a point around at random and lets a theorem do the work; the collage run backwards, which is the deterministic one and the one that broke worst; and escape time without the escape, which is not really escape time at all but earns its keep anyway.

Then, because the bugs were more instructive than the features, three ways to lose a fractal: the clipping, the mask, and the feedback loop. Each one produced a picture that looked fine until something else disagreed with it.