Frontend Systems — Production Reference

Not a tutorial. Not a framework comparison.
A structured reference for reasoning about frontend systems in production.

Each section explores architectural decisions, rendering strategies, performance trade-offs, and failure modes that emerge as systems scale.

← Previous

JavaScript Engine & Runtime

Hoisting

During the creation phase of an execution context, the engine allocates bindings for declared identifiers before execution begins. Function declarations are fully initialized, 'var' bindings are initialized to undefined, and 'let'/'const' bindings are created but remain uninitialized until evaluation (Temporal Dead Zone). No code is physically moved; this is a binding-time behavior.

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

✅ Good Practices

  • Understand creation phase vs execution phase and binding initialization timing.

❌ Anti-Patterns

  • Believing hoisting is code reordering instead of execution context initialization.

🧠 Decision

Avoid relying on implicit initialization semantics; declare and initialize bindings explicitly to preserve temporal clarity.

📈 Scale Impact

Prevents hidden initialization assumptions and reduces debugging ambiguity in large modular systems.

⚖ Consistency Model

Lexical binding model established during execution context creation.

🏗 Infrastructure Impact

No infrastructure impact; affects runtime determinism and debuggability.

🔥 Failure Mode

TDZ access throws ReferenceError; 'var' access before assignment returns undefined, potentially masking logic errors.