Skip to content
G.

interactive systems lab

Inspect the machinery

Small, deterministic experiments that expose the internal state behind networks, algorithms, and browser graphics.

live artifacts

Learn, experiment, inspect

Each lab includes its model boundary, text alternatives, source material, and build tradeoffs—not only the animated result.

  1. lab/01

    Network Workbench

    Follow one application message across HTTP, TCP, IPv4, and Ethernet. Then drop its first transmission and inspect the retry.

    • protocols
    • state machines
    • SVG + GSAP
    Open experiment
  2. lab/02

    Routing Explorer

    Compare BFS and Dijkstra through their queues, distances, predecessors, and routes on an editable weighted graph.

    • graph algorithms
    • reducers
    • semantic SVG
    Open experiment
  3. lab/03

    Canvas Packet Field

    Drive hundreds of pooled packets through a fixed-step Canvas simulation, then compare simulated counters with measured browser telemetry.

    • Canvas 2D
    • frame loops
    • object pooling
    Open experiment
  4. lab/04

    Transform Observatory

    Edit local transforms inside a nested Three.js scene, then inspect inherited world coordinates, cameras, materials, lights, and raycast selection.

    • scene graphs
    • matrix transforms
    • R3F picking
    Open experiment

next graphics stage

Spatial query explorer

The next graphics lab will expose how a quadtree or bounding volume hierarchy narrows collision and picking queries instead of testing every object in a crowded field.