How JavaScript Actually Works: V8, JIT, and Execution Context

How JavaScript Actually Works: V8, JIT, and Execution Context

by

Stop defining JavaScript as just “single-threaded.”
Learn how the V8 Engine, JIT compilation, and Execution Context actually work — explained the way Senior Developer interviews expect.

If I asked you to define JavaScript, you’d probably give the textbook answer:

“JavaScript is a single-threaded, non-blocking, asynchronous language.”

That answer is correct — but it’s also basic.

If you’re aiming for Senior Developer roles at companies like Oracle, Walmart, or Cred, this definition won’t cut it.

Interviewers at that level aren’t testing definitions.
They’re testing depth of understanding.

They want to know things like:

  • What actually happens inside the CPU when you declare a variable?

  • How does Chrome turn your React code into machine code?

  • Why does var behave differently from let in memory?

JavaScript: Beyond the Basics

In this blog of the JavaScript: Beyond the Basics series, we’re tearing apart the JavaScript Engine to see what really happens behind the scenes.

We’ll cover:

  • The V8 Engine

  • Just-In-Time (JIT) Compilation

  • The most critical concept in JavaScript: Execution Context

1. JavaScript Engine vs Runtime Environment (A Common Misconception)

One of the biggest misconceptions developers have is confusing the JavaScript Engine with the Runtime Environment.

They are not the same thing.

Think of it like a restaurant 🍽️

🧑‍🍳 The Engine (V8) — The Chef

The JavaScript Engine’s job is simple:

  • Take your code

  • Execute logic

  • Manage memory

Examples of JavaScript Engines:

  • V8 → Chrome, Node.js

  • SpiderMonkey → Firefox

  • JavaScriptCore → Safari

The engine does not:

  • Handle timers

  • Access the DOM

  • Perform network requests

🏠 The Runtime — The Kitchen

The Chef works inside a Kitchen.
The Kitchen provides tools the Chef doesn’t have.

Browser Runtime provides:

  • DOM APIs

  • setTimeout

  • fetch

Node.js Runtime provides:

  • File System

  • OS APIs

  • Networking

👉 Key Takeaway:
Node.js is just a different kitchen for the same chef (V8).
That’s why JavaScript can run on servers without a browser window.

2. Inside the V8 Engine: The Execution Pipeline

Now let’s look inside the Chef’s brain.

How does V8 actually execute your JavaScript?

The V8 Pipeline

Source Code -> Parser -> AST (Abstract Syntax Tree) -> Ignition (Interpreter) -> TurboFan (Optimizing Compiler) -> Machine Code

Step 1: Parsing

V8 takes your JavaScript source code and:

  • Breaks it into tokens

  • Converts it into an AST (Abstract Syntax Tree)

The AST is a structured, tree-like representation of your program’s logic.

Step 2: JIT Compilation (Just-In-Time)

This is where JavaScript gets its performance.

V8 uses a hybrid compilation strategy:

🔥 Ignition — The Interpreter

  • Converts AST into bytecode

  • Starts executing immediately

  • Ensures fast startup

🚀 TurboFan — The Optimizing Compiler

  • Watches code as it runs

  • Identifies “hot” functions (called frequently)

  • Re-compiles them into highly optimized machine code

This is why modern JavaScript can:

  • Power 3D games

  • Handle high-traffic backend servers

  • Compete with traditionally compiled languages

JavaScript literally optimizes itself while running.

3. Javascript V8 Execution Context (The Most Important Concept)

Once code is compiled, it still needs a structure to execute.

That structure is the Execution Context.

Whenever a JavaScript file runs, the engine creates a Global Execution Context.

This always happens in two phases.

Phase 1: Creation Phase (Memory Allocation)

Before a single line of code executes, JavaScript:

  • Allocates memory for variables

  • Allocates memory for functions

Behavior during this phase:

  • var → initialized as undefined

  • let and const → allocated but uninitialized (Temporal Dead Zone)

Phase 2: Execution Phase

Now the engine:

  • Executes code line by line

  • Assigns real values to variables

  • Invokes functions

Why This Matters: Hoisting Explained

Consider this code:

console.log(a);
var a = 10;

Why does this print undefined instead of crashing?

Because:

  • During the Creation Phase, a was created and initialized to undefined

  • During the Execution Phase, console.log(a) ran before a = 10

That’s hoisting — not magic.

🎓 Senior Developer Interview Quiz

Test your understanding before your next interview.

Level 1: Fundamentals

Q1: Is JavaScript interpreted or compiled?

Answer:
JavaScript is JIT-compiled.
V8 uses:

  • Ignition (interpreter) for fast startup

  • TurboFan (compiler) for optimized machine code

Q2: Where are primitives vs objects stored?

Answer:

  • Primitives → Call Stack

  • Objects & arrays → Heap

  • Stack holds a reference to heap memory

Q3: Engine vs Runtime?

Answer:

  • Engine → Executes JavaScript logic

  • Runtime → Provides APIs (DOM, timers, filesystem)

Level 2: Tricky Scenarios

Q4: What happens to var during creation phase?

Answer:
It is hoisted and initialized with undefined.

Q5: What happens to let during creation phase?

Answer:
It is hoisted but uninitialized and remains in the Temporal Dead Zone (TDZ).

Q6: Function Declaration vs Function Expression hoisting?

Answer:

  • Function declarations → fully hoisted

  • Function expressions → hoisted as variables (undefined)

Leave a Comment