frontend / README.md

Browser Internals — Senior Interview Prep

1 min read index source

Browser Internals — Senior Interview Prep

How the browser actually works: the event loop, the rendering pipeline, DOM/BOM/CSSOM trees, storage layers, service workers, web workers, real-time transports, HTTP caching, and CORS. The senior threshold isn’t trivia — it’s being able to explain why a behavior happens and predict edge cases from first principles.

Files

# Topic
01 Event loop — macrotasks, microtasks, rAF, idle
02 Rendering pipeline deep dive
03 DOM, BOM, CSSOM — the trees
04 Storage APIs — localStorage, IndexedDB, Cookies, Cache API, OPFS
05 Service Workers and PWAs
06 Web Workers, SharedWorker, BroadcastChannel
07 WebRTC and WebTransport
08 HTTP caching headers — Cache-Control, ETag, Vary
09 CORS at the protocol level — preflight, credentials, exposed headers

Why “browser internals”?

Most “weird browser bug” investigations trace back to one of:

  • Task ordering confusion (microtask vs animation frame).
  • Layout / paint cost invisible until profiled.
  • Cache layering (browser cache, service worker cache, HTTP cache, app cache) interacting.
  • CORS subtleties (credentials, preflight, vary).
  • Worker boundaries (no DOM access, structured-clone vs Transferable).

A senior front-end can localize a bug to the right layer in one or two questions because they have the mental model.

Cross-references