S//LSTATIC//LAB

STATIC SITE / ZERO SERVER RUNTIME

A website can be static without being boring.

This whole thing is HTML, CSS, JavaScript and JSON served as files. No Node server. No database. No framework runtime. It still has client-side routing, persistence, async data, canvas graphics, search, filters, keyboard controls, offline caching, responsive UI and installable-app metadata.

Break something
01Responsive layout
02Async static data
03Persistent browser state
04Canvas interaction
05Offline service worker

ASYNC DATA EXPLORER

The Archive

These cards are loaded from a JSON file with fetch(), then searched, filtered and sorted entirely in your browser.

Loading archive…No filter

CANVAS / POINTER EVENTS

Signal Network

The graph is drawn onto a <canvas>. Drag nodes around. The animation loop, hit detection and physics are all client-side JavaScript.

Selected nodeNone

Grab one of the nodes and throw it around.

drag nodes · resize window · nothing leaves your browser

LOCAL STATE / URL STATE / EVENTS

Browser Sandbox

A small fake control room to demonstrate state that survives refreshes without any account or database.

SESSION NOTESAUTOSAVED
PARAMETER ENGINEA-000
50
30
15

The sliders alter the URL query string, so this state can be bookmarked/shared without a database.

EVENT LOG

Signal score
COMMAND PALETTEesc