Learning outcomes

• How CPUs fetch, decode, execute, and writeback instructions
• Register usage and instruction scheduling
• Branch prediction and pipeline optimization
• Cache hierarchy (L1/L2/L3) and cache line behavior
• Stack vs heap memory allocation
• Virtual memory and memory layout
• Memory alignment and pointer arithmetic

• Socket programming with TCP and UDP
• TCP handshake and flow control mechanisms
• HTTP protocol: headers, chunked encoding, keep-alive
• TLS handshake and certificate verification
• WebSocket upgrade process and frame handling
• Network debugging with tcpdump and Wireshark
• Simulating network conditions for testing

​

HTML parsing

• Tokenization state machine with 13 states and 67 transitions
• Tree construction algorithm
• Error recovery mechanisms and quirks mode
• Script execution: parser-blocking, async, and defer

​

CSS engine

• CSS tokenization and parsing
• Selector matching with specificity calculation
• Cascade resolution algorithm
• Style computation and inheritance rules
• Media query evaluation

​

Layout engine

• Box model calculation
• Flow layouts, floats, and positioning schemes
• Flexbox algorithm: main/cross axis, flex basis, grow, shrink
• Grid algorithm: track sizing, placement, spanning
• Line breaking and text shaping

​

Rendering

• Layer tree construction
• Paint recording and display lists
• Rasterization strategies
• GPU compositing and texture management

​

Parsing and execution

• Lexical analysis and tokenization
• Recursive descent parser implementation
• Abstract syntax tree (AST) construction and validation
• Scope analysis and symbol resolution

​

Runtime

• Bytecode design and instruction set architecture
• Stack-based virtual machine execution
• Closure implementation with environment chains
• Prototype chain traversal
• Property lookup optimization using inline caches

​

Memory management

• Mark-and-sweep garbage collection algorithm
• Generational collection (young/old generations)
• Incremental and concurrent GC strategies
• WeakMap and WeakSet implementation
• Memory profiling and leak detection techniques

​

Event loop

• Microtask queue for Promise.then callbacks
• Macrotask queue for setTimeout and I/O
• Animation frame callbacks
• Idle callbacks and scheduling
• Task prioritization mechanisms

​

JIT compilation (optional)

• Inline caching and polymorphic inline caching
• Type feedback and speculative optimization
• Deoptimization and bailout mechanisms
• Register allocation strategies

• Tree diffing complexity: from O(n³) to O(n)
• Key-based reconciliation for list optimization
• Heuristics: component type, element type, list diffing
• Fiber architecture fundamentals
• Requestanimationframe-based update scheduling
• Double buffering for UI consistency
• Priority queues for update management
• Time slicing for interruptible rendering
• Layout thrashing detection and prevention
• Read/write batching (FastDOM pattern)
• CSS containment and layer creation
• Composite-only animations

​

Fiber reconciler

• Work loop and unit of work concepts
• Reconciliation phases: render and commit
• Effect list construction and execution
• Priority levels and lane model

​

Hooks implementation

• Hooks queue and cursor mechanism
• useEffect cleanup and dependency checking
• useRef as mutable container
• useCallback and useMemo memoization
• Custom hook composition patterns

​

Concurrent features

• Time slicing and work interruption
• Suspense and lazy loading mechanisms
• useTransition and useDeferredValue
• Automatic batching of state updates

​

Server-side rendering

• renderToString vs renderToPipeableStream
• Progressive hydration and selective hydration
• Double pass problem and solutions
• Edge rendering vs Node rendering tradeoffs

​

Next.js architecture

• File-based routing implementation
• Static site generation (SSG) with getStaticProps
• Incremental static regeneration (ISR)
• API routes and middleware
• Module bundling and code splitting strategies

​

Profiling tools

• Chrome DevTools Performance tab deep dive
• React DevTools Profiler usage
• Lighthouse metrics: FCP, LCP, TTI, CLS, FID
• Custom performance marks and measures
• Heap snapshots and allocation timelines

​

Optimization techniques

• Component memoization strategies
• Virtualized lists and windowing
• Image optimization: formats, lazy loading, responsive images
• Font optimization: subsetting, preloading, display strategies
• Bundle analysis and tree shaking
• Code splitting: route-based and component-based

​

Critical rendering path

• Eliminating render-blocking resources
• Minimizing critical CSS
• Deferring non-critical JavaScript
• Preload, prefetch, and preconnect strategies