liveBook · Manning

Execution context stack

As explained in Build a Frontend Web Framework (From Scratch)

The runtime stack of active JavaScript execution contexts used to track currently executing calls.

The execution context stack, also called the call stack, tracks JavaScript functions that are currently executing. A call pushes a function onto the top; returning pops it. When the stack becomes empty, queued callbacks can begin execution. section 13.3.2

Its runtime responsibilities are straightforward:

  • Run synchronous JavaScript immediately, keeping the active function at the stack top. section 13.3.2
  • Receive callbacks selected by the event loop after the current stack is empty. section 13.3.2
  • Provide the boundary that determines when task and microtask callbacks may run. section 13.3.2 section 13.3.3

Asynchronous mounting

During mountDOM(), an onMounted() hook begins synchronously and remains on the execution stack until its first await. The remainder resumes later as a microtask after the stack is empty, which can affect rendering and interaction timing. section 13.3.1

How Build a Frontend Web Framework (From Scratch) covers it

How deep it goes
Defines push and pop behavior and explains stack emptiness, but limits event-loop treatment to simplified browser steps.
Examples
Uses mountDOM(), onMounted(), fetch(), async/await, promise callbacks, and the browser event-loop cycle.
What it assumes
Assumes basic JavaScript functions and browser execution while introducing promises, microtasks, and task scheduling through examples.
What you can do after
Evaluate when synchronous code, lifecycle callbacks, tasks, and microtasks execute during browser scheduling.
How it connects
Connects the stack to the event loop, task queue, microtask queue, promises, and component lifecycle hooks.

Also explained in

Compare how 8 books explain execution context stack →

Related concepts

This explainer was generated by Manning's knowledge graph from the text of Build a Frontend Web Framework (From Scratch). The section links point to the parts of the book it draws on.