OB
ObservatoryReact Hook Runtime Lab
Componentsd1mu9u

Components will appear here as they render.

Use the Hook Lab to trigger events.

Timeline
renderstatereducereffectcontext
0ms
0ms1ms0ms

Start in the Hook Lab below

Pick a hook tab (useState, useReducer, etc.), click a button, then watch this timeline fill with color-coded events showing exactly what React did.

Hook Lab

Clicking +1 or -1 calls setState. This causes CounterState to re-render.

Watch: Timeline: blue "state" block (setState call) then amber "render" block (re-render).

count = 0
Event Summary

Last event

Events will show here after you interact with the Hook Lab.

Counters

render0
state0
reducer0
effect0
context0
Renders0
Trace span
0ms
State changes0
Controls
Memo