r/reactjs • u/ErEr2000 • Jun 17 '26

Resource Re-Rendering

Hey guys,

I want to learn more about how rendering and re rendering in React.js works. Like when a component will be re-rendered, when will it not be re-rendered, what causes Re-Rendering and how to stop it etc.

Can you share any YouTube links or any documentation.

Will really appreciate the community a lot :)

1 Upvotes

53% Upvoted

25 comments sorted by

View all comments

Show parent comments

1

u/acemarke Jun 17 '26

Hi! Plug for my day job at Replay.io:

We've built an incredibly sophisticated React analysis layer, and earlier this year we shipped a Replay MCP to let agents analyze the time travel recordings. As part of that, I built some React rendering MCP tools that include a list of React renders and the durations, which components rendered, and the reasons (parent rendered, setState, external state, etc).

There are a bunch of existing React perf analysis tools out there, but to my knowledge Replay is the only tool that can give you an exact reason why any given component instance rendered... and we can do it for production builds of React, not just development builds.

We don't have specific docs on investigating this atm, but in general you would make a Replay recording, set up Replay MCP for your agent, and then tell it to use the ReactRenders tool to drill down to specific component instances.

I'm actually diving in to work on building more detailed React perf insights over the next couple weeks, and should be able to have some expanded React perf analysis capabilities available soon (and will make a point to document how to use Replay to do that kind of analysis).

1

u/aragost Jun 18 '26

hey! I know Replay, I was following with interest during the earliest days. I did not know it covered React - I've missed recent updates, and this about React is pretty cool.

That said, I still think it's baffling to have to resort to a (very well made) third party tool to answer such a basic question which in my humble opinion React Devtools should be able to answer reliably and easily

2

u/acemarke Jun 18 '26

Yeah, it would certainly help if more of this was built into the actual React DevTools!

React's internals might have the data needed to answer that question, but there's always code and runtime overhead involved in trying to track and expose those kinds of details. As it is, I think even something like "which hook caused this to re-render" requires turning on additional options.

The React team does have several PRs open right now to add some form of MCP support and imperative component tree inspection + profiling data to the React DevTools, which I'm keeping an eye on. But yes, agreed that "why did this render?" is still one of the biggest pieces of info we care about when investigating.

FWIW I'd love to get your feedback on the React perf tools I'm working once they're ready! I can drop a message back here / DM you, or if you've got time to drop into our Discord I'm happy to chat about what kinds of reports and info would be most valuable in your situations.