V8 Engine

We all know the JavaScript is itself is a interpreted language but it is not true for modern JS. In this blog we are going to go deep in how JS works in browsers using V8 engine and how this v8 engine was used to create Node.js - the JS runtime for backend servers.

At first lets start with the understanding of V8 engine. How it works and covert's the raw JS to machine code so fast.

Working of V8 Engine

V8 engine is a open source JavaScript and Web Assembly Engine written in C++ which was developed by Google and is used in Chromium based Browsers which is used to compiled the raw JS syntax to machine code.

V8 breaks the JS code into binary in the following steps:

JS Code
   ↓
Parser
   ↓
AST (Abstract Syntax Tree)
   ↓
Ignition Interpreter
   ↓
Bytecode
   ↓
TurboFan JIT Compiler
   ↓
Optimized Machine Code

Lets get deep into this:

Parsing & AST (Abstract Syntax Tree)

This is the step where the raw JS code is parsed and is converted into AST. This AST is actually the tree like structured format of the code that the machines can understand for further processing. Example:

const sum = 20 + 30;

//Above code is converted into

VariableDeclaration
   |
BinaryExpression (+)
   |      |
 20      30

//This tree like structure is called AST

Ignition Interpreter & ByteCode

Now the AST reached the Ignition Interpreter where the structured tree is converted into compact bytecode. This bytecode are often more compact than the actual machine code. It looks like small instructions like:

Load a
Load b
Add
Return

After this bytecode gets generated, the engine starts executing it line by line. Note that until this point there is no execution of code, it's simple conversion of code to more machine understandable format.

Now the engine is entering into the interpretation phase where each line of instruction are executed. This is very interesting to understand that each line is getting interpreted to machine code on the go, means the code written in the last will get converted at last and the first line will get converted first. This feature of V8 make the startup of the application fast.

It means "jaise jaise aa rha hai waise waise conversion ho rha hai"

JIT (Just-In-Time) Compilation

While the interpretation is going on, V8 keeps a constant monitor of the program. It keeps the track of loops, frequently called functions and repeated operations.

Here the engine thinks that these stuffs are repetitive so should i optimize it. This optimization function are called hot functions.

This hot functions are sent to Turbofan JIT compiler where this function is converted to machine code and is saved. Now whenever this hot functions are needed to be called there this machine code gets directly executed.

Therefore no need to again interpret the bytecocde into machine code. It makes the hot functions to work super fast.

So from above we can say, JavaScript is getting interpreted and at the same time for some code it is behaving like compiled language.

Hence we usually say JS is a interpreted language but while running it using V8 Engine it becomes a hybrid language showing both properties (complied for some piece of code).

NOTE: The JIT can also de-optimize the code. For example: If a + b = always number but afterwards it becomes a = string then it throw the optized machine code and go back to interpretation. This is called de-optimization.

Microtask Queue

V8 Engine also provides a queue to handle the Promises in JavaScript. This queue is called microtask queue which executes the callbacks before the event loop begins ( in Node environment ).