Browser leaks overview

Browser tabs are long-lived. Unlike a stateless HTTP request, an SPA may run for hours. Small leaks compound.

Top browser leak patterns

Pattern	Mechanism	Lesson
Accidental globals	Assignment without `let`/`const`	Global variables
Forgotten timers	`setInterval` + closure	Timers
Detached DOM	Removed from tree, kept in JS	Detached DOM
Listeners	`addEventListener` without removal	Event listeners
Closures	Callback retains outer scope	Closures
Unbounded cache	`Map`/`{}` never evicts	Unbounded cache

flowchart LR
  SPA[SPA session hours]
  leak[Small leak per navigation]
  SPA --> leak
  leak --> crash[Tab slow / killed]

How you’ll practice

Each lesson below includes a live demo with a real-time heap chart (Chrome). Workflow:

Open lesson in Chrome
Click Start leaking — watch chart climb
Click Stop & fix — release references
Optionally force GC in DevTools and watch recovery

Quick smell test

Open DevTools → Performance monitor (More tools) → watch JS heap size while repeating an action (navigate, open modal, etc.). If heap stair-steps upward without returning to baseline, investigate.