- 0:00–0:06
Choose one page • Arabic mobile example. • Lab • Arabic mobile • Page A
Page A, the illustrative product page, stays fixed at its anchor, and a Lab tag marks the investigation area beside it. An empty field-segment card labelled Arabic mobile slides into the Lab lane and a cyan route draws from Page A to that card. The card holds only an empty dashed field: no measurements are supplied. Before the cut the route retracts and the card leaves along its own lane while Page A stays in place.
- 0:06–0:12
Inspect loading • Trace the hero request. • Lab • LCP • Hero request • Page A
Page A and Lab stay fixed. A card reading LCP and Hero request enters the Lab lane. A cyan route traces from the card towards the hero area of Page A and stops short of it, leaving an open gap marked by a dashed ring: the hero request is a question to investigate, not a completed check. The route then retracts and the card withdraws along its input lane.
- 0:12–0:18
Inspect the response • Follow the waiting interaction. • Lab • Task • INP • Response waits • Page A
Page A and Lab stay fixed. A Task block appears in the Lab lane. A tap marker travels to the button on Page A and the button is outlined; a route labelled INP then runs from the button to the Task block. A card reading Response waits arrives behind the Task block and stops there, showing a hypothetical dependency with no measured delay. Before the cut the route retracts and the INP label, Task block and waiting card leave together along the work lane.
- 0:18–0:24
Inspect the layout • Plan reserved space. • Lab • CLS • Proposed change • Page A
Page A and Lab stay fixed. A card reading CLS and Proposed change enters. A cyan outline draws around the empty lower slot of Page A while the page and its content stay still, and a route connects the proposal card to that slot. This is a plan to reserve space; no repair or result is shown. The route, outline and card then leave along their input lane.
- 0:24–0:30
Review the same segment • Assessment pending. • Lab • Arabic mobile • Field review • Page A
Page A and Lab remain fixed. The Arabic mobile card returns to its earlier place and the same route from Page A draws to it again. Once the card has landed, a closed gate labelled Field review appears, and a reading trace from the unchanged Page A reaches the gate and stops. The gate label is also repeated as native text above the gate. The gate stays closed: the same-segment assessment remains pending until comparable field evidence is available.
An illustrative Arabic mobile product page moves through loading, response and layout checks, with field assessment still pending.
Read the article: Core Web Vitals in 2026: A Field-First Debugging Workflow