-
Notifications
You must be signed in to change notification settings - Fork 50.4k
Closed
Description
In many case, I suppose that Perf is used like this.
React.addons.Perf.start();
this.setState({items: newItems},() => {
React.addons.Perf.stop();
React.addons.Perf.printInclusive();
});However, totalTime is printed as Total time: 0.00 ms.
Because setState callback is called before flushBatchedUpdates,
totalTime is computed after that.
sample: http://jsfiddle.net/koba04/9b615edu/
I think that this behavior is a little confusing...
Do you have any ideas?
my ideas
Perf.stop accepts callback
The callback is called after flushBatchedUpdates.
React.addons.Perf.start();
this.setState({items: newItems}, () => {
React.addons.Perf.stop(() => {
React.addons.Perf.printInclusive();
});
});totalTime is computed at Perf.stop
But totalTime is treated as a diff between Perf.start and Perf.stop.
- ReactDefaultPerf.js
start: function() {
if (!ReactDefaultPerf._injected) {
ReactPerf.injection.injectMeasure(ReactDefaultPerf.measure);
}
ReactDefaultPerf._allMeasurements.length = 0;
ReactPerf.enableMeasure = true;
ReactDefaultPerf.startTime = performanceNow();
},
stop: function() {
ReactPerf.enableMeasure = false;
ReactDefaultPerf._allMeasurements[
ReactDefaultPerf._allMeasurements.length - 1
].totalTime = performanceNow() - ReactDefaultPerf.startTime;
},Add some documentation
totalTimeis computed afterflushBatchedUpdates, so you need to call your perf method on the next event loop in case ofsetStatecallback.
React.addons.Perf.start();
this.setState({items: newItems},() => {
React.addons.Perf.stop();
setTimeout(() => {
React.addons.Perf.printInclusive();
}, 0);
});Thank you.
Metadata
Metadata
Assignees
Labels
No labels