Skip to content

Lab explorer

Labs

Every experiment is public, shareable and runs entirely in your browser. Progress and bookmarks stay on this device.

10 experiments

JavaScript / Runtime

Event Loop Visualizer

Step through the call stack, microtask queue and task queue to see exactly why asynchronous code runs in the order it does.

Intermediate~12 min
  • event loop
  • microtasks
  • async
JavaScript / Events

Debounce vs Throttle

Drive a high-frequency event stream and compare how debouncing and throttling change callback and request counts.

Beginner~8 min
  • events
  • debounce
  • throttle
React / Rendering

React Re-render Visualizer

Trigger state updates and watch render counts propagate through a component tree, with and without memoization.

Intermediate~10 min
  • react
  • rendering
  • memo
React / Context

Context Re-render Lab

Compare a naive context provider with a colocated, split-context version and count the wasted renders.

Advanced~12 min
  • react
  • context
  • state colocation
Performance / Virtualization

Virtualization Benchmark

Render 1,000 to 50,000 rows with and without windowing, and compare initial render time and interaction responsiveness.

Intermediate~12 min
  • virtualization
  • lists
  • benchmark
Performance / Main thread

Main Thread & Long Tasks

Schedule expensive synchronous work and watch input latency, animation smoothness and long-task duration degrade.

Intermediate~10 min
  • main thread
  • long tasks
  • INP
Browser / Rendering

Browser Rendering Pipeline

Walk DOM, style, layout, paint and composite, and see which property changes skip which stages.

Beginner~10 min
  • rendering
  • layout
  • paint
Browser / Events

Event Propagation

Click through an interactive DOM tree and trace capture, target and bubble phases node by node.

Beginner~8 min
  • dom
  • events
  • bubbling
Networking / Concurrency

Sequential vs Parallel Requests

Run the same set of requests as a waterfall and in parallel, and compare timelines and total duration.

Beginner~8 min
  • http
  • concurrency
  • waterfall
Networking / Caching

HTTP Cache Simulator

Issue requests against a simulated cache and follow HIT, MISS, revalidation and expiry through the response lifecycle.

Advanced~14 min
  • http
  • caching
  • etag