Support for ReactFeatureFlags.logTopLevelRenders timing (#8687)
Call `console.time` / `console.timeEnd` for the top level component when `ReactFeatureFlags.logTopLevelRenders` is enabled
Brian Vaughn committed
Jan 21, 2017 at 09:44 UTC
f546505e4e3d10ced09b571d4fc2dfd328402ff6
3 files changed
+18
-3
scripts/fiber/tests-failing.txt
-3
@@ -61,8 +61,5 @@ src/renderers/shared/shared/__tests__/ReactEmptyComponent-test.js
61
src/renderers/shared/shared/__tests__/ReactMultiChildText-test.js
62
* should reorder keyed text nodes
63
64
-src/renderers/shared/shared/__tests__/ReactUpdates-test.js
65
-* marks top-level updates
66
-
64
src/renderers/shared/shared/__tests__/refs-test.js
65
* Should increase refs with an increase in divs
scripts/fiber/tests-passing.txt
+1
@@ -1598,6 +1598,7 @@ src/renderers/shared/shared/__tests__/ReactUpdates-test.js
1598
* should queue updates from during mount
1599
* calls componentWillReceiveProps setState callback properly
1600
* does not call render after a component as been deleted
1601
+* marks top-level updates
1602
* throws in setState if the update callback is not a function
1603
* throws in replaceState if the update callback is not a function
1604
* throws in forceUpdate if the update callback is not a function
src/renderers/shared/fiber/ReactFiberScheduler.js
+17
@@ -40,6 +40,7 @@ var ReactFiberCompleteWork = require('ReactFiberCompleteWork');
40
var ReactFiberCommitWork = require('ReactFiberCommitWork');
41
var ReactFiberHostContext = require('ReactFiberHostContext');
42
var ReactCurrentOwner = require('ReactCurrentOwner');
43
+var ReactFeatureFlags = require('ReactFeatureFlags');
44
var getComponentName = require('getComponentName');
45
46
var { cloneFiber } = require('ReactFiber');
@@ -628,6 +629,18 @@ module.exports = function<T, P, I, TI, PI, C, CX, PL>(config : HostConfig<T, P,
629
nextUnitOfWork = findNextUnitOfWork();
630
}
631
632
+ let hostRootTimeMarker;
633
+ if (
634
+ ReactFeatureFlags.logTopLevelRenders &&
635
+ nextUnitOfWork &&
636
+ nextUnitOfWork.tag === HostRoot &&
637
+ nextUnitOfWork.child
638
+ ) {
639
+ const componentName = getComponentName(nextUnitOfWork.child) || '';
640
+ hostRootTimeMarker = 'React update: ' + componentName;
641
+ console.time(hostRootTimeMarker);
642
+ }
643
+
644
// If there's a deadline, and we're not performing Task work, perform work
645
// using this loop that checks the deadline on every iteration.
646
if (deadline && priorityLevel > TaskPriority) {
@@ -673,6 +686,10 @@ module.exports = function<T, P, I, TI, PI, C, CX, PL>(config : HostConfig<T, P,
686
}
687
}
688
689
+ if (hostRootTimeMarker) {
690
+ console.timeEnd(hostRootTimeMarker);
691
+ }
692
+
693
return deadlineHasExpired;
694
}
695