JS ENGINE for a kid
Tags: javascript, webdev, jsengine
Published: 2022-01-03 10:32:42

First where all places can javascript run, frankly speaking everywhere for example most common browser, server, smartwatch, IoT device.

Every place where the JavaScript code runs has a JavaScript Environment
 
So for the browser to run JavaScript code, it should have a JS runtime Environment that has

similarly, Node.js has a JavaScript Environment 

Let's say there is some now Amazing thing developed where we feel JS should be the preferred language to achieve a certain task what we will need?  Yes JavaScript runtime environment 

Like as we know browser has some web APIs, node.js has some other APIS. 
Now Since we now understand what is a JavaScript Runtime environment, let us check the Heart of the JavaScript Runtime Environment the 

**JavaScript Engine**


JavaScript Engine (in the case of the V8 engine) is a normal program written in c++.
What is the main purpose of the above program?

Take the high-level code and give output as code which machine can understand


Now what happens inside the JS engine 

There are 3 major things that happen 

Takes our code as input and does  

1. Parsing 
2. Compilation
3. Execution

_Let us check what happens in Parsing._ 

Check this amazing website https://astexplorer.net/

1. Break code into tokens 
2. Syntax parser > creates Abstract Syntax Tree (AST) (object which has all information about the line of code )

_Let us check what happens in Compilation._

First, what is the interpreter? 

an interpreter executes code line by line 

First, what is the compiler?

As the name says it compiles code and a new version is formed which is the optimized version of the code and then executed 

Obviously in the interpreter, since we do not need an extra step 
an interpreter is fast in the case of the compiler we have more efficiency.

Javascript can behave interpreted as well as compiled language 
At initial stages, JS was purely supposed to be interpreted language

Now, what is JIT i-e just in time compilation? 
Simply JS engine can use Interpreter as well as compiler so it is said JS engine does JIT compilation 

Now compilation and execution go hand in hand 

we have AST ready in the previous step remember 

This AST goes to the Interpreter and moves to execution and while this happens, it takes the help of the compiler to optimize the code 

This compilation step is Just in time of interpretation so it is called the JIT compiler 
 
After compilation, the byte code is sent to the execution step 

Now let us check the execution phase (has a byte code as input from compilation step)

In the Execution phase we have memory heap and call stack, these are the terms we generally hear correct.

A memory heap is a place where all variables and functions are assigned memory

garbage collector works for freeing space for memory heap if 
some object has no reference or function not used or we clear timeout, remove event handlers it uses mark and sweep algorithm (check this out on google)

V8 is very famous among JS engines Its 

The interpreter is known as Ignition 
A compiler is known as TurboFan 
The Orinoco is their Garbage collector 


![JS engine ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g3u508dvel1xcs94dnqg.png)
 


 

References

https://www.youtube.com/watch?v=2WJL19wDH68

https://blog.bitsrc.io/javascript-internals-javascript-engine-run-time-environment-settimeout-web-api-eeed263b1617

https://www.telerik.com/blogs/journey-of-javascript-downloading-scripts-to-execution-part-ii

https://www.youtube.com/watch?v=xckH5s3UuX4