mandelbulb is broken in demo website

[benrayfield]

Linked from https://gpu.rocks/#/examples
to https://gpu.rocks/#/examples
to https://observablehq.com/@robertleeplummerjr/gpu-js-example-mandelbulb

This used to work, a year or more ago, but does not anymore. See error on browser console in attached pic.

[fuzzie360]

I dug into this. The bug is in the notebook itself, not in GPU.js or on this site, and it's a four-line reorder to fix.

Root cause

initFractalGPU() creates the kernel before registering the functions it calls:

const raytracer = gpu.createKernel(kernelMarchingRays)
  .setConstants({ pxWidth, pxHeight, iterations: 100 })
  .setOutput([pxWidth, pxHeight])
  .setGraphical(true)
  .setDebug(true)
  .setLoopMaxIterations(10000);
gpu.addFunction(sdPlane);      // <-- too late, kernel already exists
gpu.addFunction(mandelbulb);
gpu.addFunction(distScene);
gpu.addFunction(hsv2rgb);

createKernel() snapshots the GPU instance's function list at creation time, so functions added to gpu afterwards never reach that kernel. When the transpiler then hits let col = hsv2rgb(...), hsv2rgb is unknown, FunctionBuilder.lookupReturnType() falls through to return null, and astVariableDeclaration throws Markup type null not handled — the error in the screenshot, reported at line 28 position 3.

Why it used to work

The ordering has always been wrong, but older GPU.js tolerated it. Testing the same call pattern across releases:

GPU.js	addFunction after createKernel
2.0.0 – 2.5.0	works
2.9.4 and later	throws Markup type null not handled

The notebook pins gpu.js@2.15.1, which is on the failing side of that line — so bumping the pinned version at some point is what turned a latent bug into a hard failure.

Fix

Move the four addFunction calls above createKernel:

gpu.addFunction(sdPlane);
gpu.addFunction(mandelbulb);
gpu.addFunction(distScene);
gpu.addFunction(hsv2rgb);
const raytracer = gpu.createKernel(kernelMarchingRays)
  .setConstants({ pxWidth, pxHeight, iterations: 100 })
  .setOutput([pxWidth, pxHeight])
  .setGraphical(true)
  .setDebug(true)
  .setLoopMaxIterations(10000);

I verified this by running the notebook's published cell source unmodified against gpu.js@2.15.1 in headless Chrome with a real WebGL2 context: as published it throws Markup type null not handled on line 28, position 3 and the canvas never gets sized past the default 300×150; with only that reorder applied it compiles clean, sizes to 500×500, and renders the fractal correctly.

This needs an edit on the notebook itself (@robertleeplummerjr/gpu-js-example-mandelbulb), which is outside this repo — @robertleeplummerjr, would you be able to apply it?

Two related notes

• The upstream example this notebook was forked from, examples/mandelbulb.html, already has the correct order (gpu.addFunction(...) chained before createKernel), so there is nothing to fix in GPU.js.
• I checked the other 19 Observable notebooks linked from the examples page for the same pattern. Only this one is affected. The sibling Mandelbrot Set notebook looks similar at a glance but is fine — it chains .addFunction() onto the kernel (gpu.createKernel(...).addFunction(f)), which registers on that kernel before it compiles and works correctly. All 26 example links also still resolve, so there's no link rot to clean up.