React's "render" performance can be broken up into three steps:

1. recursively call render() methods (or hook-style functions), generating a virtual dom structure that will replace whatever is already there
2. use "reconciliation" to compare this new virtual dom with the existing dom, and generate a list of dom modifications that it can batch together
3. execute that dom modification list against the browser. This last step is the only "IO" in this process, calling out to the browser, forcing reflows / repaints etc

When you profile an action using the React Dev tools, you can see the number of ms a specific component took to "render".

What is that actually measuring?

Is it just 1.? Is it 1. and the amount of 2. and 3. that occurred because of that component?

If it's the latter, how do you work out what the split between them is? If it's the former (which I suspect to be true) how do you work out the true cost factoring in 2. and 3.?