Что такое движок javaScript

Движок(engine) javaScript - это программа, которая выполняет код javaScript. У каждого браузера свой javaScript движок.

• Самый популярный js движок - это V8 в google chrome. При помощи этого движка так же работает и node js.
• С помощью node js можно создавать приложения на js которые работают вне браузера.

Как работает движок js

Каждый js движок имеет стек вызовов(call stack) и кучу(heap).

• (call stack)Стек вызовов - это место где код выполняется. Выполняется он при использовании контекста выполнения. Так же в контекста выполнения хранятся все наши примитивные значения и ссылки на объекты и функции.
• (heap)Куча - это неструктурированная(динамическая) часть памяти, которая содержит все объекты и функции которые нужны в нашем приложении.

Компиляция и интерпретация

Компьютер может понимать только набор нулей и единиц, поэтому, любая программа в итоге должна быть трансформирована в машинный код. Это можно сделать при помощи компиляции, либо при помощи интерпретации.

• Компиляция: весь код сразу преобразуется в машинный код и записывается в переносной двоичный файл, который может быть выполнен на компьютере. При компиляции у нас есть два главных шага, первое это компиляция, а второе это выполнение кода. Сам запуск выполнения кода, может произойти намного позже компиляции.

• Интерпретация: интерпретатор просматривает исходный код и выполняет его построчно. Исходный код преобразуется в машинный код, сразу перед выполнением кода, а не раньше.

Компиляция на лету(JIT)

Javascript - Это интерпретируемый язык, но в современных реалиях не совсем.
JIT (Just-In-Time) - это компиляция которая используется для оптимизации работы javascript. Так как интерпретация javascript довольно медленный способ выполнения кода. Но устаревшие версии браузеров не использют JIT. Это например - Internet Explorer, такие как IE6, IE7 и IE8, а также устаревшие версии Firefox, Safari и Chrome.

• Компиляция на лету(JIT): если коротко - это техника оптимизации, используемая для ускорения выполнения кода. JIT позволяет компилировать код в машинный код во время выполнения программы, а не заранее.

Как работает JIT компиляция в Js

Когда запускается код javascript, он сначала анализируется парсером и преобразуется в абстрактное синтаксическое дерево (AST). Затем интерпретатор преобразует AST в байт код и оптимизирует его.Затем Байт код компилируется в машинный код компилятором и выполняется. Процесс преобразования AST в байт код и оптимизации может повторяться. Такой метод работы значительно улучшает скорость выполнения программы, потому что код выполняется немедленно, а затем постепенно оптимизируется по мере необходимости.

• Парсинг: значит чтение кода. Парсер(Parser) - это программа которая построчно читает код и понимает как он соответствует грамматике, определенной языком программирования, и что он собирается делать. В нашем случае парсер создает абстрактное синтаксическое дерево AST.
• Байт-код - это форма промежуточного представления кода, которая более низкоуровневая, чем исходный код, но более высокоуровневая, чем машинный код. Обычно генерируется компилятором или интерпретатором. В JIT используется для оптимизации, перед компиляцией в машинный код.
• AST(Abstract Syntax Tree) - Наш код разбивается на смысловые кусочки и сохраняется в дереве в структурированном виде. Это представление нашего кода внутри движка js.

Здесь я вам рекомендую прочитать статью: Знай свой JIT: ближе к машине. Тут вы подробно узнаете о том как работает JIT.

Кстати вот как выглядит например переменная ввиде AST. Ну это так, вдруг вам интересно стало))

const anime = 'hello';

Среда выполнения в браузере (JavaScript Runtime Environment)

Среда выполнения(в браузере) - это окружение которое содержит в себе нужные компоненты необходимые для использования javaScript.

• Главное в runtime это сам движок js.

• Так же используются Web API. setTimeout например и так далее - это функциональность предоставляемая движку, доступная в объекте window. Сама эта функциональность не является частью js.

• Так же runtime имеет callback queue(колбек очередь) - Это структура данных которая содрежит все callback функции готовые к выполнению.

• И event loop(цикл событий) - Помещает из колбек очереди функции в стек вызовов. Когда происходит событие, например клик мыши, то колбек функция попадает в очередь колбеков (callback queue). После этого, когда стек вызовов очищается, то эта колбек функция передается в стек вызовов, что бы выполниться.

07.12.2022Обновлено 07.04.2023