typescript
Type System Lab
Edit source. Inspect inferred types and real compiler diagnostics.
Real TypeScript 5.9.3 compiler; type checking does not execute your program.
Open the experiment →The laboratory
Make a prediction.
Change something. Observe.
Each lab exposes a model you can manipulate. Real runtimes and simplified simulations tell you exactly what they do—and what they cannot prove.
javascript
JavaScript Workbench
Run small programs in an isolated, time-limited worker.
Actual JavaScript execution. Observed output is not a proof of correctness.
Open the experiment →javascript
Event Loop Visualizer
Step through stack, host work, tasks, and microtasks.
Deterministic teaching model of selected browser event-loop behavior.
Open the experiment →react
React Render Lab
Inspect batching, stale closures, identity, and effect dependencies.
Live React experiments plus explicitly labeled lifecycle traces.
Open the experiment →sql
Database Lab
Explore related tables and execute SQL against a resettable local database.
Real SQLite in WebAssembly. PostgreSQL policies and concurrency are taught separately.
Open the experiment →supabase
RLS Policy Simulator
Change identity and policies. Inspect visible rows and attempted writes.
Deterministic policy model, not a PostgreSQL server or security certification.
Open the experiment →api
HTTP Inspector
Construct a request and trace authentication, validation, retries, and responses.
A local network simulation. No requests reach an external service.
Open the experiment →git
Git Graph Simulator
Stage, commit, branch, merge, and resolve conflicting histories.
A bounded graph model. It does not change a real repository.
Open the experiment →css
CSS Layout Lab
Manipulate seven real layout models, from flex and grid to stacking contexts.
Actual browser CSS rendering; observations depend on your viewport.
Open the experiment →html
DOM Structure Lab
Edit semantic markup and inspect the parsed element tree.
Actual browser HTML parsing in a sandbox; not an accessibility audit.
Open the experiment →production
Debugging Lab
Investigate a symptom, choose evidence, and test a hypothesis.
Authored cases with bounded diagnosis checks, progressive hints, and transfer tasks.
Open the experiment →games
Game Loop Lab
Compare frame-based motion with delta time in a live Canvas scene.
Actual Canvas animation with bounded simulation parameters.
Open the experiment →games
Performance Budget Lab
Allocate network, CPU, texture, and frame budgets before optimizing.
Explicit estimates. Measure the real application before claiming a speedup.
Open the experiment →web-systems
Deployment Flow Lab
Trace a commit through gates, build artifacts, caching, and rollback.
A local deployment simulation. Nothing is published.
Open the experiment →csharp
Language Comparison Lab
Compare values, functions, models, collections, errors, and async across four languages.
Annotated examples; this lab does not run Python or C#.
Open the experiment →graphics
3D Scene Playground
Manipulate an actual scene, camera, lights, mesh, material, and transforms.
Real Three.js/WebGL rendering, loaded only when launched.
Open the experiment →The compiler, database and 3D engines load only when their experiment needs them. The rest of your learning remains lightweight.