Revelations: How JavaScript Works Behind The Scenes

Jinali Pabasara
Apium Innovations
Published in
4 min readDec 23, 2021

What is JavaScript?

JavaScript started as a scripting language to implement advanced and dynamic features on web pages. However, with the development of a variety of frameworks and libraries, we can use JavaScript for a variety of purposes including web development, Backend development, Mobile application development, and Games development.

Having a deep and clear understanding of important concepts in JavaScript allows us to write clean and effective code. In This series of articles, I’m expecting to dive deep into concepts such as event loop, scope, closure, Hoisting, Temporal Dead Zone, and how JavaScript works behind the scenes.

In the first article of the series, I will be explaining how JavaScript converts into Machine code and all the steps involved in the process.

Just-In-Time compilation (JIT)

Computers can only understand Binary code and assembly language which are referred to as low-level languages. In that case, every programming language needs to convert into machine code using an interpreter or a compiler.

In compilation, the entire code converts into machine code at once and write to a binary file (portable file) which can be executed by a computer. In this method, code execution can happen way after the compilation

compilation

In the interpretation, the interpreter runs through the source code and executes it line by line. This process read the code and execute it at the same time without generating a portable file

interpretation

JavaScript used to be a completely interpreted language. However as interpreted languages are significantly slower than compiled languages, modern JavaScript engines use a combination of interpretation strategy and compilation strategy which is called Just-In-Time compilation.

Just-In-Time compilation converts the entire JavaScript code into Machine code at once and then executes it immediately which speeds up the compilation process. This method does not generate a portable file.

Just-In-Time compilation

How Just-In-Time Compilation works

JavaScript Just-In-Time compilation happens inside the JS engine (I’ll be explaining about JS engine in the upcoming articles).

what happens inside JS Engine

The first step in this process is Parsing the source code. JS engine uses a parser to go through our JS source code line by line and detect syntax errors. Parse is aware of all the rules of JavaScript and in that case, if it encounters any errors in the source code it will throw an error and stop the code execution.

If there are no errors in the source code, the parser generates the Abstract Syntax Tree (AST). This is a tree data structure that represents the source code in a tree structure. AST does not contain all the details in the syntax. It represents only content-related information.

Generated AST then convert into machine code and execute right away. However modern JS engines have an optimization method. In this method, the JS engine creates an unoptimized version of the machine code at first and starts to execute it as fast as possible. Meanwhile, the machine code is optimized and recompiled in the already running program execution.

This article is an explanation of how the JavaScript code is compiled into machine code. In the next article, I’ll be explaining JS runtime Environment and JS engine and I hope I was able to help you understand the Just in time compilation process of JavaScript.

At Apium Innovations we build world class software products while following the best practices in JavaScript, follow us to learn more.

Thank you for reading!

Interested in what we do? Check us out at www.apium.io

--

--

Jinali Pabasara
Apium Innovations

Software Engineer | Tech Enthusiast | AWS | NodeJS | Typescript