bi-16 step 02 — Explain setCount(count + 1)
Goal
The capstone deliverable: one state update, eight layers, twice — once exhaustively, once in ninety seconds.
Tasks
Answer, with measurements from your own application:
- What framework work is scheduled, at what priority, and is it batched?
- Which components re-render, and why those?
- Which DOM operations result? Count them.
- What does that mutation invalidate? Cite
css_properties.json5. - Does layout run? For which boxes? What could force it early?
- Does paint re-record, or is this a property-tree change only?
- Which thread and process does each step run on, and where are the hops?
- When is the frame presented, and what could have made it late?
Then the part that demonstrates mastery: construct two variants of the same visible change — one that reaches the GPU having skipped style, layout and paint, and one that runs every stage. Explain the difference at each of the eight layers.
Finally, deliver the same explanation in ninety seconds to someone who has never thought below the framework.
Done when
- Eight questions answered with measurements, not description
- Two variants built, measured, and explained layer by layer
- Both the long and the ninety-second versions delivered