Skip to content

15. JS Engine Exposed, Google V8 Architecture.md

Latest commit

 

History

History
142 lines (104 loc) · 4.72 KB

15. JS Engine Exposed, Google V8 Architecture.md

File metadata and controls

142 lines (104 loc) · 4.72 KB

JS Engine Exposed, Google V8 Architecture

What is a JavaScript Engine?

A JavaScript Engine is a program that:

  • Reads JavaScript code (source code)
  • Parses and compiles it
  • Executes it on the machine

Different environments have different engines:

  • Chrome / Node.js → V8
  • Firefox → SpiderMonkey
  • Safari → JavaScriptCore

💡 "JS Engine exposed" usually means:

  • Understanding how the JS engine works internally (execution flow, memory handling, optimizations)
  • Knowing which parts are exposed to developers (e.g., ECMAScript features)
  • Recognizing what's not part of the JS engine (e.g., DOM APIs, setTimeout — these come from the environment, not the engine itself)

Google V8 — Overview

V8 is:

  • Open-source JavaScript & WebAssembly engine
  • Written in C++
  • Used in:
    • Google Chrome
    • Node.js
    • Deno

Known for:

  • JIT compilation (Just-In-Time)
  • Garbage Collection (automatic memory management)
  • High performance

V8 Architecture — Main Components

Here's the big picture:

┌─────────────────────────┐
│ JavaScript Source Code  │
└───────────┬─────────────┘
            │
      1️⃣ Parser
            │
┌───────────▼─────────────┐
│ Abstract Syntax Tree    │
│ (AST)                   │
└───────────┬─────────────┘
            │
2️⃣ Interpreter (Ignition)
            │
┌───────────▼─────────────┐
│ Bytecode                │
└───────────┬─────────────┘
            │
    Hot Code Detected
            │
3️⃣ Optimizing Compiler (TurboFan)
            │
┌───────────▼─────────────┐
│ Optimized Machine Code  │
└─────────────────────────┘

Step-by-step in detail:

1. Parser

  • Takes JS source code and creates an AST (Abstract Syntax Tree).
  • The AST is a structured representation of code, making it easier for the engine to analyze.

2. Ignition (Interpreter)

  • Converts AST → Bytecode (lightweight instructions for the engine to execute).
  • Runs the code immediately without waiting for full compilation.
  • This gives fast startup.

3. TurboFan (Optimizing Compiler)

  • Watches code while it runs.
  • If it sees a function running many times (a "hot" function), it optimizes it into highly efficient machine code.
  • Makes repeated operations faster.

Memory Management in V8

Heap → Stores objects, arrays, closures, etc.

Stack → Stores function calls and primitive variables

Garbage Collector (Orinoco / Oilpan):

  • Automatically frees memory for objects that are no longer reachable
  • Uses generational GC (young vs old objects)
  • Uses incremental & concurrent GC to avoid blocking execution

V8 and the JS Runtime

Important: V8 only runs JavaScript.

It doesn't:

  • Provide DOM APIs (document.querySelector, etc.)
  • Provide setTimeout, fetch

Those come from the host environment:

  • Browser → Web APIs
  • Node.js → libuv & Node APIs

The runtime = V8 + host environment APIs + Event Loop.

Interview-ready Short Answer

"V8 is Google's high-performance open-source JavaScript and WebAssembly engine, written in C++. It parses JS into an AST, interprets it into bytecode with Ignition, and optimizes hot code into machine code with TurboFan. It also manages memory with an advanced garbage collector. V8 doesn't provide DOM or timers — those come from the host environment like browsers or Node.js, which, together with V8 and the Event Loop, form the full JavaScript runtime."

Visual Diagram

┌─────────────────────────┐
│    JavaScript Code      │
└───────────┬─────────────┘
            ▼
┌───────────────────────┐
│       Parser          │ → AST
└───────────┬───────────┘
            ▼
┌─────────────────────────┐
│  Ignition Interpreter   │ → Bytecode
└───────────┬─────────────┘
            ▼
    Hot Functions Detected
            ▼
┌─────────────────────────┐
│   TurboFan Compiler     │ → Optimized Machine Code
└─────────────────────────┘