Sparked from this twitter conversation when talking about doing fast async rendering of declarative UIs in Preact
These examples show how it's possible to starve the main event loop with microtasks (because the microtask queue is emptied at the end of every item in the event loop queue). Note that these are contrived examples, but can be reflective of situations where Promises are incorrectly expected to yield to the event loop "because they're async".
setTimeout-only.js
is there to form a baselinechained-promises.js
shows the event loop being starved when many microtasks are queued at oncepromises-returning-promises.js
shows chained.then()
calls starving the event loopnested-chained-promises.js
shows nested.then()
calls starving the event looppromise-all.js
showsPromise.all()
also suffers from this
For more on microtasks and the event loop, check out Jake Archibald's article "Tasks, microtasks, queues and schedules"
It could, but doesn't have to. The goal of that example is only to show that a promise within a promise still gets resolved on the same turn of the mocrotask queue.