If you have an interesting thought, or you get nerd sniped, you should have somewhere to explore your ideas. That’s what Scratch is for. It holds small web experiments, each one starting with some inconsequential question.

Scratch is available here. All of the architecture and development notes are available here.

The whole thing is a single Flask app deployed in a Podman container on the same VPS as this blog. Adding a new experiment is as simple as dropping a subdirectory into the repo and registering a route in app.py.

Settlers React

An interactive Settlers of Catan UI that demonstrates optimistic updates and responsive SVG layouts.

This thought experiment / demo was inspired by the Catan web app I’ve been working on sporadically for several years.

The board is rendered entirely with SVG. Each hexagonal tile, edge, vertex, and port indicator is a React component positioned by a gridDataBuilder utility that computes SVG coordinates from a declarative board definition. The viewBox is calculated dynamically from the outermost tile vertices, so the grid scales to any screen size with no pixel math inside the components.

The demo focuses on the “road placement” aspect of Catan. Clicking an available edge immediately renders the road in a pending color (an optimistic update) then fires a mock API call that succeeds or fails with equal probability. On success, the road snaps to its final color. On failure, the board reverts to its original state and the activity log records the rollback. This pattern mirrors how real game clients handle network latency without freezing the UI.

Token Bucket

A simple interactive visualization of the token bucket algorithm for rate limiting.

The token bucket is a classic rate limiting strategy: a bucket refills with tokens at a fixed rate, and each incoming request consumes one or more tokens. If the bucket runs dry, requests are rejected until enough tokens accumulate. It’s the same algorithm behind rate limiters in systems like DynamoDB’s RCU/WCU model.

The demo lets you configure four parameters in real time:

• Request pattern: Slow and steady, bursts, slow and steady with bursts, or heavy and steady.
• Bucket capacity: How many tokens the bucket can hold.
• Refill rate: Tokens added per timestep.
• Token cost per request: Tokens consumed by each request.

Animated particles show requests flowing down to the bucket and refills flowing up from below, with accepted/rejected/overflow feedback shown inline. A live statistics table tracks the last 100 requests.