The Process of Executing JavaScript in V8

Introduction

This article provides a concise overview of how the V8 engine executes JavaScript, describing each transformation step from source code to machine code and discussing the trade‑offs between time and space.

V8 Execution Process

The following diagram is broken down step by step.

JS to AST

When V8 receives JavaScript code, the parser performs lexical analysis and syntax analysis.

Lexical Analysis

The source is tokenized into the smallest units (tokens) with a type and value.

Syntax Analysis

Tokens are assembled into an Abstract Syntax Tree (AST), a structured representation used by many front‑end tools such as Vue, React, and Babel.

Bytecode Generation

After parsing, the Ignition interpreter converts the AST into bytecode (intermediate code). Although the CPU cannot execute bytecode directly, this step reduces the amount of work compared to compiling straight to machine code.

Caching Machine Code

Because most scripts do not change between page loads, V8 can cache compiled machine code in memory or on disk, trading space for faster subsequent execution.

Problems of Caching

Caching large machine code can dramatically increase memory usage, potentially turning a few‑kilobyte script into dozens of megabytes of cached data.

Lazy Compilation

Early V8 versions introduced lazy compilation: only global‑scope code is compiled and cached initially; function‑scope code is compiled on first call and not cached.

Issues with Lazy Compilation

When many large libraries are loaded as functions (e.g., jQuery plugins), the on‑demand compilation can cause noticeable pauses.

Introducing Bytecode

Bytecode is a compact representation of the program; it occupies far less memory than machine code while still requiring a final translation to native code at execution time.

Compiler

Hot Code

V8 monitors frequently executed code paths; code that runs repeatedly is marked as hot code .

Optimizing Compiler (TurboFan)

The TurboFan optimizer compiles hot bytecode into machine code and caches it, achieving a space‑for‑time trade‑off similar to earlier caching strategies.

De‑optimization

If a hot function’s structure changes at runtime, the optimized machine code becomes invalid; V8 de‑optimizes it back to AST, re‑interprets, and may re‑optimize later.

Summary

V8 combines an interpreter (Ignition) and an optimizing compiler (TurboFan) in a JIT (Just‑In‑Time) architecture, using ASTs, bytecode, lazy compilation, and hot‑code optimization to balance execution speed and memory consumption.

For deeper details such as inline caches, hidden classes, and garbage collection, see the author’s other articles.

Call to Action

If you found this article helpful, please click “Watch” to increase its visibility and follow the public account “Zhengcai Cloud Frontend Team” for more curated content.

Recruitment

The Zhengcai Cloud Frontend Team (ZooTeam) in Hangzhou is hiring passionate front‑end engineers. To apply, email [email protected] .