What is the difference between stack frame and Execution context? Are they the same thing in Javascript?

Question

I’m trying to deepen the operation of javascript and I’m having doubts between some definitions I found. First, a simplified representation of the javascript execution environment in the browser would be this:

I started studying about the Javascript (Call stack) stack and found a definition that says:

A call stack (call stack) is formed by 1 or more stack frames. A stack frame is added/stacked in the call stack every time a function is called.

The representation would be that:

Up to this point I was able to understand, but I came across a slightly different definition saying that:

A call stack is a collection of Execution contexts(contexts of execution) and that an execution context is created and stacked when a function is called.

I’ve even seen them call the call stack Execution stack.

These definitions represent the same structure in Javascript or are different Stacks?

Answer 1

The information is a bit flawed. It is not wrong, it is even this, but "execution context" is something broader. There are several execution contexts, which in a way we can call scope (I don’t know if it’s exactly the same because this term is used more in JS itself). There is the overall implementation context and the locations of the functions, and the stack frame is confused with an execution context since a function has its own execution context.

Seems wrong to me global stack frame because that information can’t be stacked, it needs to be in an unstructured area, like a heap and not a stack.

From what I understand stack frame is used more concretely of how it is implemented and Execution context is used as a more abstract concept.

So I guess it’s just a matter of different terminology looking at different levels of abstraction.