The Research Nest
Published in

The Research Nest

How does your web browser run Javascript?

A quick summary

Photo by Claudio Schwarz on Unsplash

Questions on web browsers are frequently asked in interviews. For example, the process of loading a webpage in a browser from the moment a URL is entered is one of the most asked interview questions.

Here, let’s talk specifically about how javascript (JS) runs.

JS is a client-side scripting language. This means your browser (aka the client) runs it. How?

Every browser comes with a JS Engine which also acts like a virtual machine that helps us run the code.

Did you know that different browsers use different JS engines?

👉🏻 Chrome uses V8
👉🏻 Edge uses Chakra
👉🏻 Firefox uses Spider monkey

Here’s a simplified summary of what happens:

  • The JS engine locates the script/JS code, checks the syntax, and parses it into an Abstract Syntax Tree (AST). Think of it as a tree-like representation of the code. This step is done by a “parser”.
  • The AST is converted into bytecode and run by an interpreter. In the case of the V8 engine, the interpreter is called “ignition”.
  • The bytecode and the profiling data generated while running it is passed to a Just in time (JIT = compilation during runtime) compiler that can produce highly optimized machine code.
  • In the case of the V8 engine, the compiler is called “Turbofan”.
  • In the case of Chakra and Spider monkey, there are some differences in these steps and they use two optimizing compilers.

The rest of the steps and architecture in most JS engines are similar.

I hope you got a good overview.

Here are some links for more in-depth exploration:

This content was first published by me here.

--

--

--

Empowering humanity with exclusive insights.

Recommended from Medium

On-demand to use libraries in Vitejs project

Understanding Express Servers — RUN__ON Part 3

Quarantimer — A timer to get your quarantine into perspective

Angular Material — Dialog — Return Data

Understand JavaScript Modern Syntax and Some Functionality

javaScript

Building a DeviceInfo Package for Android in React Native

Node.js: In Go We Trust

Title

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
XQ

XQ

Tech 👨‍💻 | Astronomy 🌠 | Life 🌱 | Poetry 🖊️ | Careers 👔

More from Medium

Become a JavaScrip Guru | Array Functions

Asynchronous JavaScript and Promises

Creating Projects That Build Skill and Impress FAANG

JS Closures