Iron Canvas | Rust WebAssembly Geometry Demo

Project logic

One source of truth, rendered through WASM

The rectangle starts as a single Rust vertex array. The browser reads those vertices from WebAssembly memory, draws them to canvas, and requests transforms through exported Rust functions.

Geometry

Rust owns the math

Rotation happens in `rotate_z`, using the rectangle center as the pivot. Positive degrees rotate clockwise so the browser controls match what the user sees.

Boundary

WASM exposes a small API

JavaScript calls exported functions for reset, rotation, vertex count, and memory pointers. It never duplicates the transform formulas.

Rendering

Canvas is a view layer

The canvas maps world coordinates to pixels, marks the original top edge, and prints the current vertex buffer for inspection.

Implementation

How a click becomes a transform

The interaction is intentionally simple, which makes the data flow easy to inspect from UI event to Rust memory mutation.

Select an angle. The UI passes either `45` or `90` into the WASM export.
Rotate in Rust. Rust iterates over the current vertex buffer and calls `rotate_z` for each `[x, y, z]` position.
Read the updated buffer. JavaScript reads the same WASM memory as a `Float32Array`.
Redraw the canvas. The browser projects the updated coordinates to pixels and refreshes the output panel.

Quality

Tested like a tiny production app

Rust tests

Unit and integration tests verify bounds, closed geometry, clockwise rotation, center stability, and repeated rotations.

Web/WASM tests

Node tests instantiate the compiled WASM module, validate exports, rotate the runtime buffer, and confirm negative zero is hidden.

CI/CD

GitHub Actions run formatting and the full test suite, then build the static `web/` artifact for GitHub Pages deployment.

Vertices