Runtime concepts & more
Собрала для себя и для вас список полезных метариалов о выполнении JavaScript в браузере. Если коротенько, то:
1. Javascript is a single threaded single concurrent language, meaning it can handle one task at a time or a piece of code at a time.
2. Сalling a function creates a new stack frame for that function's use.
Call Stack is a data structure which
records the function calls, basically where in the program we are. If we call a function to execute , we
push something on to the stack, and when we return from a function, we
pop off the top of the stack.
3. A
queue is a simple data structure that allows elements to be inserted from one end, called the rear (also called tail), and deleted from the other end, called the front (also called head). This behavior is called FIFO (First in First Out).
4. JavaScript has a concurrency model based on an
event loop, which is responsible for executing the code, collecting and processing events, and executing queued sub-tasks.
5. The loop gives priority to the call stack, and it first processes everything it finds in the call stack, and once there's nothing in there, it goes to pick up things in the event queue.
6. The processing of functions continues until the stack is once again empty; then the event loop will process the next message in the queue (if there is one).
7. In web browsers, messages are added anytime an event occurs and there is an event listener attached to it. If there is no listener, the event is lost. So a click on an element with a click event handler will add a message--likewise with any other event.
The function setTimeout is called with 2 arguments: a message to add to the queue, and a time value (optional; defaults to 0). The time value represents the (minimum) delay after which the message will actually be pushed into the queue. For that reason, the second argument indicates
a minimum time and not a guaranteed time.
8. Event loop basic job is to look both at the stack and the task queue, pushing the first thing on the queue to the stack when it see stack as empty. Each message or callback is processed completely before any other message is processed.
How JavaScript works in browser and node?@gaurav.pandvia/understanding-javascript-function-executions-tasks-event-loop-call-stack-more-part-1-5683dea1f5ec' rel='nofollow'>Understanding Javascript Function Executions — Call Stack, Event Loop , Tasks & more
Concurrency model and the event loopUnderstanding the JavaScript call stackThe Little Guide of Queue in JavaScriptMicrotasks
