This website
← projectsmeta · web
Can a fixed-viewport, no-scroll shell stay usable for real content?
Agent island JS
1.6 KB gz
gzip of the inlined island script, commit 9e8830a
Steering maths tests
18
vitest run, commit a6dd73a
Lighthouse score
—
pending · M4 audit (PHI-45)
Astro 6 · TypeScript · Tailwind v4 · Cloudflare Pages · 2026
Problem
Portfolio sites collapse into templates: a scrolling page, a wall of cards, numbers nobody can check. The brief for this one was different — a fixed viewport where panels slide instead of scrolling, a live simulation of steering agents as the signature element, and a standing rule that no metric appears anywhere without a source.
Approach
Content is data: every project, note, and build-log entry is a markdown file with a
schema-checked frontmatter, so adding one is a commit, never a code change. The shell
is Astro with view transitions; the agents are a vanilla-TypeScript canvas island
ported from my COS30002 steering coursework. The honest-numbers rule is enforced
mechanically — a metric without a source field fails the build.
Architecture
A 200px rail and a 100dvh stage; five panel routes joined by directional slide
transitions. One island owns the canvas: pure steering maths over an injected seeded
RNG, an engine for the loop and DPR-aware sizing, and a readout that displays only
live-measured values. CI runs type-check, build, and the steering tests on every push,
then deploys to Cloudflare Pages.
Results
The metrics above are the build’s own receipts: the island’s gzipped size, the test count, and a Lighthouse card that stays an em-dash until the M4 audit actually runs.
Reflection
The constraint is the design. No-scroll forces every panel to fit the viewport, which forces editing; the source-required schema forces every claim to carry its receipt. The build log on this site records the decisions as they happened, commit by commit.