● S1 WebGPU wasm32

Breakout

The first playable Crucible sample — the same apps/breakout that builds a native binary, running here.

breakout — crcbl

Starting…

Click the canvas first. A canvas has to hold keyboard focus to receive keys, and browsers will not start audio until you have interacted with the page. Clicking away pauses the game and lets go of whatever key was held — no platform sends the release for a key that was down when focus left.

Touch reaches the engine. A contact arrives as an ordinary pointer, and the first one is also the gesture a browser waits for before it will start audio. Whether this demo can be played with one is in its controls below — not all of them can. Switching tabs pauses the game and lets go of whatever was held: no platform sends the release for an input that was down when focus left.

controls

Two keys or a finger, plus the three the loop keeps.

Move the paddle ← → or drag
Launch the ball Space or tap
Restart after a win or loss Space or the button on screen
Pause — and from it, fullscreen and the debug panel the PAUSE button, top right
Pause and resume Esc
Fullscreen F11
Debug overlay F3
Debug console `
Pause, fullscreen and the debug overlay keys — unless a control for them is listed above
Debug console, and its on-screen keyboard the CONSOLE button, once you have touched the canvas

what is actually running

The native sample, with four differences the browser forces.

Start-up is polled across several frames, because requestDevice is a promise and the main thread cannot block on it. The frame loop is driven by requestAnimationFrame out here rather than by a loop inside the engine. The clock is the browser's, because wasm32-unknown-unknown has no Instant. And the high score lives in the Origin Private File System instead of ~/.config.

Everything else — the ECS, the fixed-tick server, the swept-sphere collision, the render graph, the spatial audio — is the same code the native build runs.

Open the console for the engine's log. The wasm module imports nothing, not even console.log, so log lines are queued inside wasm and drained by the page each frame. crcbl.audio(), crcbl.saves() and crcbl.logLevel(4) are there too.