How to use the JavaScript Promises Visualizer
- 1. Set it upWrite lines like log A, timeout 0 B, then C D, microtask E, async F G.
- 2. RunPress Run the event loop.
- 3. ReplayStep through and watch each queue fill and empty, and the console grow.
Worked example
The sample program logs A, sets a 0 ms timeout for B, chains then C then D, queues microtask E, runs an async function that logs F, awaits, and logs G, then logs H. The output is A → F → H → C → E → G → D → B. A, F and H are synchronous. Then the microtasks run in the order they were queued: C, E and G (the code after await). Running C resolves its promise, which queues D at the back, so D comes after G. The timer B runs last, even with a 0 ms delay.
Checked against real JavaScript
The simulator follows the event loop rules: run all synchronous code, then empty the microtask queue, then run one timer and empty the microtask queue again, and so on. I generated 300 random programs from the same building blocks, ran their JavaScript in Node.js, and every console order matched the simulator. The JavaScript for your program is shown under the editor, so you can paste it into a browser console and check it yourself.
Rules worth memorising
- Promise callbacks and code after await always run before any timer, however short its delay.
- Each .then in a chain is queued only when the previous one finishes, so chains interleave with other microtasks.
- A microtask queued inside a timer callback runs before the next timer.
Frequently asked questions
Why don't I write real JavaScript?
Running typed code would need eval, which this site avoids. The building blocks cover the patterns interview questions use.
Do browsers and Node give the same order?
For these patterns, yes. Node-only features like process.nextTick and setImmediate aren't included.
What does async F G mean?
An async function that logs F, then awaits, then logs G.
Is the JavaScript promises visualizer free?
Yes. You can use the JavaScript promises visualizer without signing up. The first time you run it, we ask once for your name and WhatsApp number; after that the JavaScript promises visualizer and every other Uncodemy tool open straight away.