Change how ReactPerf.printWasted() and ReactPerf.printOperations() work #6632
Description
#6046 is a rewrite of ReactPerf that aims to provide the existing features of ReactPerf in a more testable and future-proof way. However there are a few things that are out of scope of #6046 but are important to fix later after it is shipped.
Today, printOperations() prints informations about the DOM “native” events that supposedly happened. Later, this information is used by printWasted() in the following way: if a component was rendered but no DOM events on its children were emitted during a batch, the render is considered wasted.
There are a few problems with this:
- As discussed in Add ReactNativeOperationHistoryDevtool to track native operations #6612, we overemphasize the overhead of DOM operations which are actually often negligible.
- With incremental reconciliation (New Core Algorithm #6170), the assumption that DOM operations happen in the same batch as rendering might become incorrect.
- We might want to get rid of relying on batches at all: Add new ReactPerf #6046 (comment).
I don’t know what would be a good solution considering these constraints. People widely consider printWasted() the most useful ReactPerf method because it helps finding shouldComponentUpdate() sweet spots. If we remove its reliance on DOM, we should offer an equivalent (e.g. deeply comparing React elements?) that is just as useful but more friendly to incremental reconciliation.