When a process is loaded in memory, the process memory’s is divided in different parts into the memory stack. This is a nice schema to understand how the memory divides your code based on your declarations (because static variable aren’t the same than local variable, right?):
And, when the main method of your code is executed, something like this happens:
Each method present in your main function have a different memory stack. While your code is being executed, each function expands the dynamic space of memory when each function is invoked.
This is a very common memory behavior across programming languages related with memory.
On the other hand, we have the CPU stack. It determines the order into the code is called.
Then, what happens on the stack?
Basically, the functionality of the stack is the same, but it can be interrupted by events. The event loop manager decides what and when an event is executed, and puts the event on the stack.
It’s a little difficult to imagine, but fortunately, @philip_roberts explains the concept very well in his talk at JSConfeu:
The website that Philip uses to simulate stack state is loupe. Try to exec different codes and predict its performance :-)