Table of contents
Part I — Foundations: the JS way
- What JavaScript is, and the engines that run it
- Running JS: console, Node, and your first script
- Values and types: primitives, coercion,
==vs=== - Variables and scope:
var/let/const, hoisting, the TDZ - Operators and control flow
- Functions in depth: closures,
this,call/apply/bind - Objects and prototypes: the prototype chain, classes as sugar
- Arrays and iteration: methods, iterators, generators
- Strings, template literals, and regular expressions
- Error handling:
try/catch, customErrorsubclasses - Mini project: a CLI todo app (Node)
Part II — Intermediate: async JavaScript and the event loop
12. The call stack, heap, and the event loop model
13. Callbacks and Promises: what actually happens under the hood
14. async/await: sugar over promises, and its sharp edges
15. Timers and scheduling: setTimeout, rAF, requestIdleCallback, MessageChannel
16. Modules: CommonJS vs ES Modules, bundlers, dynamic import()
17. Mini project: an async task queue with concurrency limits and retry
Part III — Inside the browser
18. The browser's process model: multi-process architecture and site isolation
19. Browser engines compared: Blink/V8, Gecko/SpiderMonkey, WebKit/JavaScriptCore
20. The DOM and BOM: window, document, node trees, the CSSOM
21. The critical rendering path: bytes → DOM → CSSOM → render tree → layout → paint → composite
22. Compositing and the GPU: layers, rasterization, the 16.6ms frame budget, jank
23. The event model: capturing, bubbling, delegation, passive listeners
24. Mini project: finding and fixing jank with the Performance panel
Part IV — HTTP, networking, and the browser
25. HTTP fundamentals for JS developers
26. HTTP/1.1 vs HTTP/2 vs HTTP/3 in the browser
27. fetch and XMLHttpRequest: requests, streaming, aborting
28. CORS in depth: same-origin policy, preflight, credentials
29. HTTP caching and the browser cache
30. WebSockets and Server-Sent Events
31. Mini project: a resilient fetch client (timeout, retry, cache, dedup)
Part V — Rendering web applications in depth 32. Rendering models: CSR, SSR, SSG, ISR 33. Virtual DOM reconciliation vs fine-grained reactivity (signals) 34. Hydration and partial/progressive/resumable hydration 35. Core Web Vitals: LCP, INP, CLS — measuring and fixing them 36. Mini project: a virtual-DOM renderer from scratch (~150 lines)
Part VI — Advanced JS: concurrency and multi-threaded browser apps
37. Why JS is (mostly) single-threaded, and what that really means
38. Web Workers: postMessage, structured clone, transferable objects
39. SharedArrayBuffer and Atomics: real shared-memory concurrency
40. Shared Workers and Service Workers: lifecycle, scope, background sync
41. Multi-threaded architecture patterns: worker pools, Comlink-style RPC
42. Mini project: a multi-threaded Mandelbrot renderer (worker pool + SAB)
Part VII — Client-side storage and encryption
43. Cookies in depth: attributes, HttpOnly/Secure/SameSite
44. localStorage and sessionStorage: API, quotas, pitfalls
45. IndexedDB: transactional storage for structured, larger data
46. The Web Crypto API: hashing, AES-GCM, key derivation, asymmetric crypto
47. What client-side encryption can't protect against: the XSS threat model
48. Mini project: an encrypted notes app (Web Crypto + IndexedDB)
Part VIII — Expert: engine internals and browser security 49. Inside V8: parsing, Ignition bytecode, TurboFan, hidden classes, inline caches 50. Garbage collection and memory leaks in real JS apps 51. Browser security internals: CSP, sandboxing, Spectre, site isolation
Part IX — Capstone I 52. Capstone: an offline-first, multi-threaded, end-to-end-encrypted notes PWA
Part X — Modern JavaScript: deep, current, and fun 53. Metaprogramming: Symbols, Proxy and Reflect 54. Iterators, generators and streams: data that arrives over time 55. JavaScript in 2026: the features worth adopting now 56. JavaScript puzzles: predict the output, then explain it
Part XI — JavaScript and AI: models in the browser, agents in the UI 57. Machine learning in the browser: WebGPU, WebAssembly and Transformers.js 58. WebLLM: running a real LLM entirely in the browser 59. Built-in AI and streaming conversational UIs 60. Agents in JavaScript: the tool-calling loop 61. Actionable UI: a small framework for agentic interfaces 62. Edge functions: JavaScript next to your users 63. Mini project: Support Desk — a working agentic web app
Part XII — Client-side security, authentication and the OWASP lists 64. The browser threat model, and the OWASP "top 20" 65. OWASP Top 10:2025, implemented in JavaScript 66. OWASP Top 10 for LLM Applications, in a JavaScript agent app 67. Authentication in the browser: sessions, tokens, OAuth and passkeys 68. Mini project: harden and audit Support Desk
Part XIII — Reading the source: popular open-source JavaScript
69. How to read a large JavaScript codebase
70. Preact: a whole React in a few kilobytes
71. Signals from the inside: push dirtiness, pull values
72. Zustand: a state manager in 20 lines, and useSyncExternalStore
73. Hono: routing with one regex, middleware as an onion
Part XIV — End-to-end testing in depth with Playwright 74. A testing strategy for web apps, and how Playwright works 75. Setting up Playwright for a real project 76. Writing tests that survive refactors 77. Advanced techniques: mocks, streams, clocks, users, a11y, visuals 78. Flakiness, debugging and CI: war stories from this suite
Part XV — Capstone II: Browser Lab 79. Architecture and setup 80. Station walkthrough: from URL to bytes 81. Station walkthrough: rendering, the event loop and V8 82. Station walkthrough: threads and storage 83. Station walkthrough: Core Web Vitals and debugging 84. Testing the lab, extending it, and where to go next
Appendices
- A. Event-loop task-ordering cheat sheet
- B. Storage options comparison table
- C. Web Crypto API cheat sheet
- D. Glossary
- E. Further reading
- F. Playwright cheat sheet
- G. Modern platform features: support at a glance (October 2026)