Build log

Status

Not started. This log is written by Claude Code during the cloud session that builds the demo, then lightly edited.

The brief

The prompt the session received, verbatim, and a link to the cloud session and PR.

Approach

What was chosen and why. Alternatives considered. Anything reused from open source, with license and link.

Timeline

Short dated entries as the work progressed: what was tried, what broke, what fixed it.

Numbers

Rough wall-clock time, number of turns, tokens or cost if known, bundle size, frames per second on a laptop and a phone.

What I would do next

Known gaps, stretch goals, ideas.

Original spec

Pathfinding Lab

Build an interactive pathfinding visualiser in projects/pathfinding/demo/index.ts following the demo contract in CLAUDE.md.

Goal

A tool that makes the differences between search algorithms obvious: how they expand, what they cost, and when heuristics help or hurt.

Grid

• Canvas 2D grid, cell size adapts to the container; default about 50 x 30 on desktop, 25 x 40 on phones.
• Paint tools: wall, erase, weighted terrain (cost 5, drawn differently), start, goal. Click-drag and touch-drag to paint.
• Maze generators: recursive division and randomised Prim or DFS, plus a “random scatter” option with density slider. Clear walls and clear path buttons.
• Diagonal movement toggle (with corner-cutting prevented).

Algorithms

Implement from scratch in TypeScript with a shared step interface so each can be animated frame by frame:

• Breadth-first search
• Dijkstra (binary heap)
• Greedy best-first
• A* with Manhattan, Euclidean and Octile heuristics and an adjustable heuristic weight (weighted A*)
• Bidirectional BFS

Visualisation

• Animate frontier, visited and final path with distinct colours; animation speed slider and an “instant” mode.
• Stats panel after each run: nodes expanded, path cost, path length, wall-clock milliseconds.
• “Race” mode: run two selected algorithms on the same grid side by side (two canvases or split view) and compare stats.
• Keep the last result visible while editing walls, and re-run automatically when start or goal is dragged (“live” mode toggle).

Should have

• Shareable state: encode the grid (run-length encoded) in the URL hash so a layout can be linked.
• Keyboard shortcuts for tools (w, e, s, g) and space to run.

Acceptance

• npm run check and npm run build pass.
• All algorithms produce correct paths on test grids (write a few unit-style checks that run in dev mode or a small demo/tests.ts executed via node --test if practical, and record results in the build log).
• Smooth animation on a phone.
• project.json status set to live, BUILD-LOG.md complete per CLAUDE.md.