Visual Labs
Interactive visualizers that show you exactly what your code is doing — step by step, in real-time.
JS Visual Playground
Interactive code editor & visual debugger. Step through execution line-by-line, inspect scope variables & heap memory, and test async promises.
Event Loop Visualizer
Visualize the Call Stack, Web APIs, Microtask Queue, and Macrotask Queue in real-time.
Promise Execution
See how promise chains execute, resolve, reject, and how errors propagate through catch blocks.
Closure Visualizer
Understand lexical scoping and see how closures store variables in memory with live state.
React Fiber Visualizer
Step through initial component tree mount, setState dispatch, workInProgress diffing, and commit phase updates.
Browser Rendering Pipeline
Step-by-step visualizer for HTML parsing, CSSOM construction, Layout tree calculation, Painting, and Compositing.
Web Workers & Multi-threading
Visualize structured clone data transfer between main UI thread and background web worker threads.
"Guess the Output" JS Quiz
Interactive quizzes on coercion, scope, and event loop order with automated step animations.
CSS Layout Challenges
Interactive Flexbox & CSS Grid micro-challenges with visual target diff scoring.
Change Detection
Visualize how Angular traverses the component tree during an application tick to check for changes.
RxJS Streams
Understand operators like map, switchMap, and filter visually by seeing values emit over time.
Dependency Injection
See how the injector hierarchy resolves tokens, providers, and handles root vs component providers.