diff --git a/packages/react-reconciler/src/SchedulingProfiler.js b/packages/react-reconciler/src/SchedulingProfiler.js index bb78ca655461f..7e06b9821600a 100644 --- a/packages/react-reconciler/src/SchedulingProfiler.js +++ b/packages/react-reconciler/src/SchedulingProfiler.js @@ -30,6 +30,13 @@ function formatLanes(laneOrLanes: Lane | Lanes): string { return ((laneOrLanes: any): number).toString(); } +// Create a mark on React initialization +if (enableSchedulingProfiler) { + if (supportsUserTiming) { + performance.mark(`--react-init-${ReactVersion}`); + } +} + export function markCommitStarted(lanes: Lanes): void { if (enableSchedulingProfiler) { if (supportsUserTiming) { @@ -167,9 +174,7 @@ export function markRenderStopped(): void { export function markRenderScheduled(lane: Lane): void { if (enableSchedulingProfiler) { if (supportsUserTiming) { - performance.mark( - `--schedule-render-${formatLanes(lane)}-${ReactVersion}`, - ); + performance.mark(`--schedule-render-${formatLanes(lane)}`); } } } diff --git a/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js b/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js index 1a4ad9cf08b68..ce6bc2ac0904c 100644 --- a/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js +++ b/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js @@ -56,6 +56,7 @@ describe('SchedulingProfiler', () => { beforeEach(() => { jest.resetModules(); global.performance = createUserTimingPolyfill(); + marks = []; React = require('react'); @@ -64,8 +65,6 @@ describe('SchedulingProfiler', () => { ReactNoop = require('react-noop-renderer'); Scheduler = require('scheduler'); - - marks = []; }); afterEach(() => { @@ -78,12 +77,18 @@ describe('SchedulingProfiler', () => { expect(marks).toEqual([]); }); + // @gate enableSchedulingProfiler + it('should log React version on initialization', () => { + expect(marks).toEqual([`--react-init-${ReactVersion}`]); + }); + // @gate enableSchedulingProfiler it('should mark sync render without suspends or state updates', () => { ReactTestRenderer.create(
); expect(marks).toEqual([ - `--schedule-render-1-${ReactVersion}`, + `--react-init-${ReactVersion}`, + '--schedule-render-1', '--render-start-1', '--render-stop', '--commit-start-1', @@ -97,7 +102,10 @@ describe('SchedulingProfiler', () => { it('should mark concurrent render without suspends or state updates', () => { ReactTestRenderer.create(, {unstable_isConcurrent: true}); - expect(marks).toEqual([`--schedule-render-512-${ReactVersion}`]); + expect(marks).toEqual([ + `--react-init-${ReactVersion}`, + '--schedule-render-512', + ]); marks.splice(0); @@ -130,7 +138,8 @@ describe('SchedulingProfiler', () => { expect(ReactNoop.flushNextYield()).toEqual(['Foo']); expect(marks).toEqual([ - `--schedule-render-512-${ReactVersion}`, + `--react-init-${ReactVersion}`, + '--schedule-render-512', '--render-start-512', '--render-yield', ]); @@ -150,7 +159,8 @@ describe('SchedulingProfiler', () => { ); expect(marks).toEqual([ - `--schedule-render-1-${ReactVersion}`, + `--react-init-${ReactVersion}`, + '--schedule-render-1', '--render-start-1', toggleComponentStacks( '--suspense-suspend-0-Example-\n at Example\n at Suspense', @@ -186,7 +196,8 @@ describe('SchedulingProfiler', () => { ); expect(marks).toEqual([ - `--schedule-render-1-${ReactVersion}`, + `--react-init-${ReactVersion}`, + '--schedule-render-1', '--render-start-1', toggleComponentStacks( '--suspense-suspend-0-Example-\n at Example\n at Suspense', @@ -222,7 +233,10 @@ describe('SchedulingProfiler', () => { {unstable_isConcurrent: true}, ); - expect(marks).toEqual([`--schedule-render-512-${ReactVersion}`]); + expect(marks).toEqual([ + `--react-init-${ReactVersion}`, + '--schedule-render-512', + ]); marks.splice(0); @@ -264,7 +278,10 @@ describe('SchedulingProfiler', () => { {unstable_isConcurrent: true}, ); - expect(marks).toEqual([`--schedule-render-512-${ReactVersion}`]); + expect(marks).toEqual([ + `--react-init-${ReactVersion}`, + '--schedule-render-512', + ]); marks.splice(0); @@ -306,7 +323,10 @@ describe('SchedulingProfiler', () => { ReactTestRenderer.create(