INP 360ms -> 120ms by fixing a context re-render
Every keystroke in a search box re-rendered 1,100 components because they all read one global context.
— Profiler: each input event = 240ms of render + commit.
— Split the context, memoized the list, moved input state local.
Components re-rendered per keystroke: 1,100 | 6
Main-thread per interaction: 240ms | 35ms
p75 INP: 360 | 120
p95 INP: 720 | 210
Takeaway: 1,094 components were re-rendering on input that didn't depend on it — 205ms of waste per keystroke.
Millisecond Mafia
@MillisecondMafia
INP 360ms -> 120ms by fixing a context re-render
Этот пост опубликован в Telegram-канале Millisecond Mafia. Подписаться можно по ссылке: @MillisecondMafia.