1. Foundations of Frontend Performance
Frontend performance describes how quickly and smoothly a web application loads, renders, and responds to a user's actions. It is not just about raw speed measured in the lab; it s...
Read full chapter →The essential Frontend Performance cheat sheet: 8 concise chapters you can read in minutes, distilled from the full deck. When you're ready, drill the flashcards or test yourself under exam conditions.
Frontend performance describes how quickly and smoothly a web application loads, renders, and responds to a user's actions. It is not just about raw speed measured in the lab; it s...
Read full chapter →To act on performance you have to understand the path the browser walks from bytes to pixels. The critical rendering path is the sequence in which the browser parses HTML, builds t...
Read full chapter →The transport layer shapes perceived performance as much as anything in your application code. HTTP/2 introduced multiplexing so many requests share a single connection without hea...
Read full chapter →Images are usually the heaviest assets on a page, and they are also the assets most directly tied to perceived speed and layout stability. Three choices matter: format, size, and l...
Read full chapter →The fastest JavaScript is the JavaScript you never ship, and the rest of the bundle should still be smaller than you think. A practical strategy splits code into three categories:...
Read full chapter →CSS affects performance in two distinct ways: bytes over the wire and work on the main thread. The bytes come from unused rules shipped because removing them by hand is tedious. To...
Read full chapter →Once the page is loaded, the metric that matters is INP, which captures how long users wait between an interaction and the visible response. INP is bottlenecked by main-thread work...
Read full chapter →Where you render matters as much as how you render. Server-side rendering produces meaningful HTML before client-side JavaScript finishes, which improves LCP and SEO at the cost of...
Read full chapter →Done reading?
Test yourself with the Frontend Performance practice exam — timed questions, instant score, full review of wrong answers. Free.
🎯 Take the Practice Exam →