Is Javascript compiled or interpreted?

Photo by Brooke Lark on Unsplash

Is Javascript compiled or interpreted?

Consider you want to bake a cake and you have a list of ingredients to gather for that:

  • Flour
  • Butter
  • Milk
  • Sugar
  • Baking Soda

You have two approaches to go about this:

  1. You gather only one ingredient at a time and start with the preparation of the batter.
  2. You gather all the required ingredients in the desired proportion at the beginning itself and then you start the preparation of the batter.

These are exactly the two ways in which a source code is executed.

Compilers and interpreters

A compiler scans the entire program in one go and translates it into a standalone executable code. The execution happens only after the entire program is compiled.

This is analogous to gathering all the ingredients for your cake at once. Indicating that you will not start the preparation even if a single ingredient from the list is missing. Therefore, although it may be time-consuming for you to gather all the ingredients, once you start the mixing, things will happen smoothly and the time taken will be short.

An interpreter translates the program statements line by line while checking for errors. Program statements may include source code or pre-compiled code. The execution of the program takes place after every line is evaluated and hence the error is raised line by line, if any.

This is analogous to gathering your ingredients one by one. Say you already have the flour, you will start the preparation right away without bothering about whether you have the milk or not.

So which approach is more time-consuming? The build time, ie., the time taken to gather the ingredients, will be more for compilers than the interpreters. However, the run time, ie., preparation of the batter, will be much shorter.

So now let's try to understand whether JavaScript is a compiled or interpreted language.

Although the syntax of JavaScript is heavily inspired by C++ and Java, the inner workings of the language are closer to an interpreted language like Python. Let's consider an example:

console.log("Hello, there!");
oops, I should not be here
console.log("End of the program!");

An interpreter would read the first line and print "Hello, there!" and only then throw a syntax error. This also happens to be the output in the case of JavaScript. So is it fair to say that JavaScript is an interpreted language? Well, yes and no.

The initial JavaScript engines were only interpreters. However, the modern ones use something known as the Just-In-Time (JIT) compilation. The truth is that JavaScript has undergone significant evolution over the years and this has prompted the development of JIT compilation to improve performance.

But what the heck is JIT?

JIT, as the name suggests, compiles code just in time. Meaning, unlike traditional compilers where the compilation is done ahead of time (before execution of the program), JIT compilation is done during the execution of the program itself. Welp.

A JIT compiler gets rid of the inefficiencies of an interpreter through what is known as a monitor or a profiler. When a code is executed by the interpreter, the profiler keeps track of how many times different statements get hit. When this number starts growing, the profiler flags it as "warm" and ultimately "hot". It then sends it over to the compiler to get compiled and stored. Therefore, if the profiler sees that the execution is hitting the same code repeatedly (like loops), it will pull out the compiled version. This compiled version of the code is then run by an interpreter that is optimized for that type of code.

Therefore, even though JIT is not as performant as a statically typed compiled language, it improves the performance to a considerable extent as it starts picking up the warm code signatures.

Wrapping up

In JIT compilation, not all code is converted into machine code. Instead, only the frequently occurring bits are picked up by the optimizer compiler to achieve improved performance. This is very important as subjecting users to a lengthy delay while the browser executes the JavaScript code can be extremely undesirable.

As programmers, it's important for us to understand the coding patterns which may affect performance. Therefore, if you are building complex projects, you might want to consider the best coding practices to reap the maximum benefits of the JIT compiler. But more on that some other day.