Browser & Frontend Runtime
Putting it together: free-recall review
Retrieval beats re-reading. For each prompt, reconstruct a full answer from memory — naming the layers and the metrics — before you reveal the model answer. The effort of recall is what welds the seven browser lessons into one mental model.
Rebuild the capstone’s spine without looking back: the relay chain, the three-track diagnosis method, why hydration is the hinge that touches five lessons, the five canonical breaks, and the telemetry stack that catches them.
- 01Trace the eight layers of a server-rendered React product page from the user's tap to a working button, and name the metric that lands at each key moment.
- 02State the three-track method and why 'find the constraint track at the constraint moment' beats 'the page is slow'.
- 03Why is hydration called the hinge of the whole trace, and which lessons converge there?
- 04Name the five canonical breaks, the layer and metric each one hits, and the fix.
- 05Why is TTFB the highest-leverage first fix when LCP, INP, and CLS are all also poor?
- 06Describe the capstone diagnostic discipline and the observability stack that turns it into a system.
If you could reconstruct each answer from memory, you hold the capstone’s spine: the page load is a relay across eight layers on three overlapping tracks; hydration is the hinge where five lessons converge and where early INP is decided; the five canonical breaks each own a layer but routinely present as a different one; TTFB is the floor whose fix cascades to FCP and LCP; and the discipline — measure, find the constraint, fix and re-measure — plus a layered RUM-and-CI telemetry stack is what turns whole-chain understanding into a system that catches the break for you.