diff --git a/packages/react-reconciler/src/SchedulingProfiler.js b/packages/react-reconciler/src/SchedulingProfiler.js index 7e06b9821600a..4c2a18b780e68 100644 --- a/packages/react-reconciler/src/SchedulingProfiler.js +++ b/packages/react-reconciler/src/SchedulingProfiler.js @@ -11,13 +11,9 @@ import type {Lane, Lanes} from './ReactFiberLane'; import type {Fiber} from './ReactInternalTypes'; import type {Wakeable} from 'shared/ReactTypes'; -import { - enableSchedulingProfiler, - enableSchedulingProfilerComponentStacks, -} from 'shared/ReactFeatureFlags'; +import {enableSchedulingProfiler} from 'shared/ReactFeatureFlags'; import ReactVersion from 'shared/ReactVersion'; import getComponentName from 'shared/getComponentName'; -import {getStackByFiberInDevAndProd} from './ReactFiberComponentStack'; /** * If performance exists and supports the subset of the User Timing API that we @@ -65,51 +61,16 @@ function getWakeableID(wakeable: Wakeable): number { return ((wakeableIDs.get(wakeable): any): number); } -let getComponentStackByFiber = function getComponentStackByFiberDisabled( - fiber: Fiber, -): string { - return ''; -}; - -if (enableSchedulingProfilerComponentStacks) { - // $FlowFixMe: Flow cannot handle polymorphic WeakMaps - const cachedFiberStacks: WeakMap = new PossiblyWeakMap(); - getComponentStackByFiber = function cacheFirstGetComponentStackByFiber( - fiber: Fiber, - ): string { - if (cachedFiberStacks.has(fiber)) { - return ((cachedFiberStacks.get(fiber): any): string); - } else { - const alternate = fiber.alternate; - if (alternate !== null && cachedFiberStacks.has(alternate)) { - return ((cachedFiberStacks.get(alternate): any): string); - } - } - // TODO (brian) Generate and store temporary ID so DevTools can match up a component stack later. - const componentStack = getStackByFiberInDevAndProd(fiber) || ''; - cachedFiberStacks.set(fiber, componentStack); - return componentStack; - }; -} - export function markComponentSuspended(fiber: Fiber, wakeable: Wakeable): void { if (enableSchedulingProfiler) { if (supportsUserTiming) { const id = getWakeableID(wakeable); const componentName = getComponentName(fiber.type) || 'Unknown'; - const componentStack = getComponentStackByFiber(fiber); - performance.mark( - `--suspense-suspend-${id}-${componentName}-${componentStack}`, - ); + // TODO Add component stack id + performance.mark(`--suspense-suspend-${id}-${componentName}`); wakeable.then( - () => - performance.mark( - `--suspense-resolved-${id}-${componentName}-${componentStack}`, - ), - () => - performance.mark( - `--suspense-rejected-${id}-${componentName}-${componentStack}`, - ), + () => performance.mark(`--suspense-resolved-${id}-${componentName}`), + () => performance.mark(`--suspense-rejected-${id}-${componentName}`), ); } } @@ -183,11 +144,9 @@ export function markForceUpdateScheduled(fiber: Fiber, lane: Lane): void { if (enableSchedulingProfiler) { if (supportsUserTiming) { const componentName = getComponentName(fiber.type) || 'Unknown'; - const componentStack = getComponentStackByFiber(fiber); + // TODO Add component stack id performance.mark( - `--schedule-forced-update-${formatLanes( - lane, - )}-${componentName}-${componentStack}`, + `--schedule-forced-update-${formatLanes(lane)}-${componentName}`, ); } } @@ -197,11 +156,9 @@ export function markStateUpdateScheduled(fiber: Fiber, lane: Lane): void { if (enableSchedulingProfiler) { if (supportsUserTiming) { const componentName = getComponentName(fiber.type) || 'Unknown'; - const componentStack = getComponentStackByFiber(fiber); + // TODO Add component stack id performance.mark( - `--schedule-state-update-${formatLanes( - lane, - )}-${componentName}-${componentStack}`, + `--schedule-state-update-${formatLanes(lane)}-${componentName}`, ); } } diff --git a/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js b/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js index ce6bc2ac0904c..79580d17202fd 100644 --- a/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js +++ b/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js @@ -12,29 +12,6 @@ import ReactVersion from 'shared/ReactVersion'; -function normalizeCodeLocInfo(str) { - return ( - str && - str.replace(/\n +(?:at|in) ([\S]+)[^\n]*/g, function(m, name) { - return '\n in ' + name + ' (at **)'; - }) - ); -} - -// TODO (enableSchedulingProfilerComponentStacks) Clean this up once the feature flag has been removed. -function toggleComponentStacks(mark) { - let expectedMark = mark; - gate(({enableSchedulingProfilerComponentStacks}) => { - if (!enableSchedulingProfilerComponentStacks) { - const index = mark.indexOf('\n '); - if (index >= 0) { - expectedMark = mark.substr(0, index); - } - } - }); - return expectedMark; -} - describe('SchedulingProfiler', () => { let React; let ReactTestRenderer; @@ -162,9 +139,7 @@ describe('SchedulingProfiler', () => { `--react-init-${ReactVersion}`, '--schedule-render-1', '--render-start-1', - toggleComponentStacks( - '--suspense-suspend-0-Example-\n at Example\n at Suspense', - ), + '--suspense-suspend-0-Example', '--render-stop', '--commit-start-1', '--layout-effects-start-1', @@ -175,11 +150,7 @@ describe('SchedulingProfiler', () => { marks.splice(0); await fakeSuspensePromise; - expect(marks).toEqual([ - toggleComponentStacks( - '--suspense-resolved-0-Example-\n at Example\n at Suspense', - ), - ]); + expect(marks).toEqual(['--suspense-resolved-0-Example']); }); // @gate enableSchedulingProfiler @@ -199,9 +170,7 @@ describe('SchedulingProfiler', () => { `--react-init-${ReactVersion}`, '--schedule-render-1', '--render-start-1', - toggleComponentStacks( - '--suspense-suspend-0-Example-\n at Example\n at Suspense', - ), + '--suspense-suspend-0-Example', '--render-stop', '--commit-start-1', '--layout-effects-start-1', @@ -212,11 +181,7 @@ describe('SchedulingProfiler', () => { marks.splice(0); await expect(fakeSuspensePromise).rejects.toThrow(); - expect(marks).toEqual([ - toggleComponentStacks( - '--suspense-rejected-0-Example-\n at Example\n at Suspense', - ), - ]); + expect(marks).toEqual(['--suspense-rejected-0-Example']); }); // @gate enableSchedulingProfiler @@ -244,9 +209,7 @@ describe('SchedulingProfiler', () => { expect(marks).toEqual([ '--render-start-512', - toggleComponentStacks( - '--suspense-suspend-0-Example-\n at Example\n at Suspense', - ), + '--suspense-suspend-0-Example', '--render-stop', '--commit-start-512', '--layout-effects-start-512', @@ -257,11 +220,7 @@ describe('SchedulingProfiler', () => { marks.splice(0); await fakeSuspensePromise; - expect(marks).toEqual([ - toggleComponentStacks( - '--suspense-resolved-0-Example-\n at Example\n at Suspense', - ), - ]); + expect(marks).toEqual(['--suspense-resolved-0-Example']); }); // @gate enableSchedulingProfiler @@ -289,9 +248,7 @@ describe('SchedulingProfiler', () => { expect(marks).toEqual([ '--render-start-512', - toggleComponentStacks( - '--suspense-suspend-0-Example-\n at Example\n at Suspense', - ), + '--suspense-suspend-0-Example', '--render-stop', '--commit-start-512', '--layout-effects-start-512', @@ -302,11 +259,7 @@ describe('SchedulingProfiler', () => { marks.splice(0); await expect(fakeSuspensePromise).rejects.toThrow(); - expect(marks).toEqual([ - toggleComponentStacks( - '--suspense-rejected-0-Example-\n at Example\n at Suspense', - ), - ]); + expect(marks).toEqual(['--suspense-rejected-0-Example']); }); // @gate enableSchedulingProfiler @@ -332,14 +285,12 @@ describe('SchedulingProfiler', () => { expect(Scheduler).toFlushUntilNextPaint([]); - expect(marks.map(normalizeCodeLocInfo)).toEqual([ + expect(marks).toEqual([ '--render-start-512', '--render-stop', '--commit-start-512', '--layout-effects-start-512', - toggleComponentStacks( - '--schedule-state-update-1-Example-\n in Example (at **)', - ), + '--schedule-state-update-1-Example', '--layout-effects-stop', '--render-start-1', '--render-stop', @@ -371,14 +322,12 @@ describe('SchedulingProfiler', () => { expect(Scheduler).toFlushUntilNextPaint([]); - expect(marks.map(normalizeCodeLocInfo)).toEqual([ + expect(marks).toEqual([ '--render-start-512', '--render-stop', '--commit-start-512', '--layout-effects-start-512', - toggleComponentStacks( - '--schedule-forced-update-1-Example-\n in Example (at **)', - ), + '--schedule-forced-update-1-Example', '--layout-effects-stop', '--render-start-1', '--render-stop', @@ -415,16 +364,8 @@ describe('SchedulingProfiler', () => { gate(({old}) => old - ? expect(marks.map(normalizeCodeLocInfo)).toContain( - toggleComponentStacks( - '--schedule-state-update-1024-Example-\n in Example (at **)', - ), - ) - : expect(marks.map(normalizeCodeLocInfo)).toContain( - toggleComponentStacks( - '--schedule-state-update-512-Example-\n in Example (at **)', - ), - ), + ? expect(marks).toContain('--schedule-state-update-1024-Example') + : expect(marks).toContain('--schedule-state-update-512-Example'), ); }); @@ -455,16 +396,8 @@ describe('SchedulingProfiler', () => { gate(({old}) => old - ? expect(marks.map(normalizeCodeLocInfo)).toContain( - toggleComponentStacks( - '--schedule-forced-update-1024-Example-\n in Example (at **)', - ), - ) - : expect(marks.map(normalizeCodeLocInfo)).toContain( - toggleComponentStacks( - '--schedule-forced-update-512-Example-\n in Example (at **)', - ), - ), + ? expect(marks).toContain('--schedule-forced-update-1024-Example') + : expect(marks).toContain('--schedule-forced-update-512-Example'), ); }); @@ -489,14 +422,12 @@ describe('SchedulingProfiler', () => { expect(Scheduler).toFlushUntilNextPaint([]); - expect(marks.map(normalizeCodeLocInfo)).toEqual([ + expect(marks).toEqual([ '--render-start-512', '--render-stop', '--commit-start-512', '--layout-effects-start-512', - toggleComponentStacks( - '--schedule-state-update-1-Example-\n in Example (at **)', - ), + '--schedule-state-update-1-Example', '--layout-effects-stop', '--render-start-1', '--render-stop', @@ -522,7 +453,7 @@ describe('SchedulingProfiler', () => { gate(({old}) => { if (old) { - expect(marks.map(normalizeCodeLocInfo)).toEqual([ + expect(marks).toEqual([ `--react-init-${ReactVersion}`, '--schedule-render-512', '--render-start-512', @@ -532,9 +463,7 @@ describe('SchedulingProfiler', () => { '--layout-effects-stop', '--commit-stop', '--passive-effects-start-512', - toggleComponentStacks( - '--schedule-state-update-1024-Example-\n in Example (at **)', - ), + '--schedule-state-update-1024-Example', '--passive-effects-stop', '--render-start-1024', '--render-stop', @@ -542,7 +471,7 @@ describe('SchedulingProfiler', () => { '--commit-stop', ]); } else { - expect(marks.map(normalizeCodeLocInfo)).toEqual([ + expect(marks).toEqual([ `--react-init-${ReactVersion}`, '--schedule-render-512', '--render-start-512', @@ -552,9 +481,7 @@ describe('SchedulingProfiler', () => { '--layout-effects-stop', '--commit-stop', '--passive-effects-start-512', - toggleComponentStacks( - '--schedule-state-update-1024-Example-\n in Example (at **)', - ), + '--schedule-state-update-1024-Example', '--passive-effects-stop', '--render-start-1024', '--render-stop', @@ -583,16 +510,8 @@ describe('SchedulingProfiler', () => { gate(({old}) => old - ? expect(marks.map(normalizeCodeLocInfo)).toContain( - toggleComponentStacks( - '--schedule-state-update-1024-Example-\n in Example (at **)', - ), - ) - : expect(marks.map(normalizeCodeLocInfo)).toContain( - toggleComponentStacks( - '--schedule-state-update-512-Example-\n in Example (at **)', - ), - ), + ? expect(marks).toContain('--schedule-state-update-1024-Example') + : expect(marks).toContain('--schedule-state-update-512-Example'), ); }); }); diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index 5ea7d961b4fd3..634c19b14ea52 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -18,7 +18,6 @@ export const enableDebugTracing = false; // Adds user timing marks for e.g. state updates, suspense, and work loop stuff, // for an experimental scheduling profiler tool. export const enableSchedulingProfiler = __PROFILE__ && __EXPERIMENTAL__; -export const enableSchedulingProfilerComponentStacks = false; // Helps identify side effects in render-phase lifecycle hooks and setState // reducers by double invoking them in Strict Mode. diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index ffab7e2c44e35..664a11a43b981 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -13,7 +13,6 @@ import typeof * as ExportsType from './ReactFeatureFlags.native-fb'; // The rest of the flags are static for better dead code elimination. export const enableDebugTracing = false; export const enableSchedulingProfiler = false; -export const enableSchedulingProfilerComponentStacks = false; export const enableProfilerTimer = __PROFILE__; export const enableProfilerCommitHooks = false; export const enableSchedulerTracing = __PROFILE__; diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index ac3e17527db00..9632b8b7da08b 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -13,7 +13,6 @@ import typeof * as ExportsType from './ReactFeatureFlags.native-oss'; export const debugRenderPhaseSideEffectsForStrictMode = false; export const enableDebugTracing = false; export const enableSchedulingProfiler = false; -export const enableSchedulingProfilerComponentStacks = false; export const replayFailedUnitOfWorkWithInvokeGuardedCallback = __DEV__; export const warnAboutDeprecatedLifecycles = true; export const enableProfilerTimer = __PROFILE__; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index d436c9e1d67c7..6f348ed149b22 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -13,7 +13,6 @@ import typeof * as ExportsType from './ReactFeatureFlags.test-renderer'; export const debugRenderPhaseSideEffectsForStrictMode = false; export const enableDebugTracing = false; export const enableSchedulingProfiler = false; -export const enableSchedulingProfilerComponentStacks = false; export const warnAboutDeprecatedLifecycles = true; export const replayFailedUnitOfWorkWithInvokeGuardedCallback = false; export const enableProfilerTimer = __PROFILE__; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js index 99b14ee92e77f..ea8f7d4e0a97e 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js @@ -13,7 +13,6 @@ import typeof * as ExportsType from './ReactFeatureFlags.test-renderer'; export const debugRenderPhaseSideEffectsForStrictMode = false; export const enableDebugTracing = false; export const enableSchedulingProfiler = false; -export const enableSchedulingProfilerComponentStacks = false; export const warnAboutDeprecatedLifecycles = true; export const replayFailedUnitOfWorkWithInvokeGuardedCallback = false; export const enableProfilerTimer = __PROFILE__; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js index bc06ea7359416..3e5046f0fccd8 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js @@ -13,7 +13,6 @@ import typeof * as ExportsType from './ReactFeatureFlags.test-renderer.www'; export const debugRenderPhaseSideEffectsForStrictMode = false; export const enableDebugTracing = false; export const enableSchedulingProfiler = false; -export const enableSchedulingProfilerComponentStacks = false; export const warnAboutDeprecatedLifecycles = true; export const replayFailedUnitOfWorkWithInvokeGuardedCallback = false; export const enableProfilerTimer = __PROFILE__; diff --git a/packages/shared/forks/ReactFeatureFlags.testing.js b/packages/shared/forks/ReactFeatureFlags.testing.js index 09e5193473d4f..8d4fe939dc09b 100644 --- a/packages/shared/forks/ReactFeatureFlags.testing.js +++ b/packages/shared/forks/ReactFeatureFlags.testing.js @@ -13,7 +13,6 @@ import typeof * as ExportsType from './ReactFeatureFlags.testing'; export const debugRenderPhaseSideEffectsForStrictMode = false; export const enableDebugTracing = false; export const enableSchedulingProfiler = false; -export const enableSchedulingProfilerComponentStacks = false; export const warnAboutDeprecatedLifecycles = true; export const replayFailedUnitOfWorkWithInvokeGuardedCallback = false; export const enableProfilerTimer = __PROFILE__; diff --git a/packages/shared/forks/ReactFeatureFlags.testing.www.js b/packages/shared/forks/ReactFeatureFlags.testing.www.js index 2dea66f08fb23..d3796937a3028 100644 --- a/packages/shared/forks/ReactFeatureFlags.testing.www.js +++ b/packages/shared/forks/ReactFeatureFlags.testing.www.js @@ -13,7 +13,6 @@ import typeof * as ExportsType from './ReactFeatureFlags.testing.www'; export const debugRenderPhaseSideEffectsForStrictMode = false; export const enableDebugTracing = false; export const enableSchedulingProfiler = false; -export const enableSchedulingProfilerComponentStacks = false; export const warnAboutDeprecatedLifecycles = true; export const replayFailedUnitOfWorkWithInvokeGuardedCallback = false; export const enableProfilerTimer = false; diff --git a/packages/shared/forks/ReactFeatureFlags.www-dynamic.js b/packages/shared/forks/ReactFeatureFlags.www-dynamic.js index 201a40fdbfa5b..9b23645a3d87e 100644 --- a/packages/shared/forks/ReactFeatureFlags.www-dynamic.js +++ b/packages/shared/forks/ReactFeatureFlags.www-dynamic.js @@ -25,12 +25,6 @@ export const decoupleUpdatePriorityFromScheduler = __VARIANT__; // NOTE: This feature will only work in DEV mode; all callsights are wrapped with __DEV__. export const enableDebugTracing = false; -// TODO: getStackByFiberInDevAndProd() causes errors when synced to www. -// This flag can be used to disable component stacks for the profiler marks, -// so that the feature can be synced for others, -// while still enabling investigation into the underlying source of the errors. -export const enableSchedulingProfilerComponentStacks = false; - // This only has an effect in the new reconciler. But also, the new reconciler // is only enabled when __VARIANT__ is true. So this is set to the opposite of // __VARIANT__ so that it's `false` when running against the new reconciler. diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index bb52cc86083a4..1c637762fe6b9 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -26,7 +26,6 @@ export const { deferRenderPhaseUpdateToNextBatch, decoupleUpdatePriorityFromScheduler, enableDebugTracing, - enableSchedulingProfilerComponentStacks, } = dynamicFeatureFlags; // On WWW, __EXPERIMENTAL__ is used for a new modern build.