Demo, all content is generated
Showcase
Open-sourced a React render-count overlay for local dev
A badge on each component showing how often it rendered.
I answer the same question on this forum every week, so I turned my debugging setup into something installable. Drop in a provider, get a count on every component, click one to see which prop changed.
v0 built the overlay interface. The interesting problem was making the overlay itself not cause renders, which took two rewrites. It is development-only and refuses to load in a production build, deliberately.
How did you stop the overlay from causing renders itself? Portal plus refs? oksana_k · edited
Refs and one requestAnimationFrame loop outside React. dev_ana · edited
Installed it. Found a context provider re-rendering the whole app on every keystroke. mei_lin · edited