Measure root component render in ReactDefaultPerf
Fixes #1074.
Ben Alpert committed
Feb 13, 2014 at 00:59 UTC
55be7a71c59c3d33e2d3b75c4fd63747f1557d60
2 files changed
+27
-19
src/browser/ReactMount.js
+22
-17
@@ -21,6 +21,7 @@
21
var DOMProperty = require('DOMProperty');
22
var ReactEventEmitter = require('ReactEventEmitter');
23
var ReactInstanceHandles = require('ReactInstanceHandles');
24
+var ReactPerf = require('ReactPerf');
25
26
var containsNode = require('containsNode');
27
var getReactRootElementInContainer = require('getReactRootElementInContainer');
@@ -288,25 +289,29 @@ var ReactMount = {
289
* @param {boolean} shouldReuseMarkup if we should skip the markup insertion
290
* @return {ReactComponent} nextComponent
291
*/
291
- _renderNewRootComponent: function(
292
- nextComponent,
293
- container,
294
- shouldReuseMarkup) {
295
- var reactRootID = ReactMount._registerComponent(nextComponent, container);
296
- nextComponent.mountComponentIntoNode(
297
- reactRootID,
298
- container,
299
- shouldReuseMarkup
300
- );
292
+ _renderNewRootComponent: ReactPerf.measure(
293
+ 'ReactMount',
294
+ '_renderNewRootComponent',
295
+ function(
296
+ nextComponent,
297
+ container,
298
+ shouldReuseMarkup) {
299
+ var reactRootID = ReactMount._registerComponent(nextComponent, container);
300
+ nextComponent.mountComponentIntoNode(
301
+ reactRootID,
302
+ container,
303
+ shouldReuseMarkup
304
+ );
305
+
306
+ if (__DEV__) {
307
+ // Record the root element in case it later gets transplanted.
308
+ rootElementsByReactRootID[reactRootID] =
309
+ getReactRootElementInContainer(container);
310
+ }
311
302
- if (__DEV__) {
303
- // Record the root element in case it later gets transplanted.
304
- rootElementsByReactRootID[reactRootID] =
305
- getReactRootElementInContainer(container);
312
+ return nextComponent;
313
}
307
-
308
- return nextComponent;
309
- },
314
+ ),
315
316
/**
317
* Renders a React component into the DOM in the supplied `container`.
src/test/ReactDefaultPerf.js
+5
-2
@@ -17,6 +17,8 @@
17
* @typechecks static-only
18
*/
19
20
+"use strict";
21
+
22
var DOMProperty = require('DOMProperty');
23
var ReactDefaultPerfAnalysis = require('ReactDefaultPerfAnalysis');
24
var ReactMount = require('ReactMount');
@@ -130,7 +132,8 @@ var ReactDefaultPerf = {
132
var rv;
133
var start;
134
133
- if (fnName === 'flushBatchedUpdates') {
135
+ if (fnName === '_renderNewRootComponent' ||
136
+ fnName === 'flushBatchedUpdates') {
137
// A "measurement" is a set of metrics recorded for each flush. We want
138
// to group the metrics for a given flush together so we can look at the
139
// components that rendered and the DOM operations that actually
@@ -223,6 +226,6 @@ var ReactDefaultPerf = {
226
}
227
};
228
}
226
-}
229
+};
230
231
module.exports = ReactDefaultPerf;