Skip to content

Commit

Permalink
Gate unstable_expectedLoadTime on enableCPUSuspense (#24038)
Browse files Browse the repository at this point in the history
  • Loading branch information
sebmarkbage authored Mar 8, 2022
1 parent 57799b9 commit 6edd55a
Show file tree
Hide file tree
Showing 13 changed files with 32 additions and 6 deletions.
10 changes: 8 additions & 2 deletions packages/react-reconciler/src/ReactFiberBeginWork.new.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,10 @@ import type {
SpawnedCachePool,
} from './ReactFiberCacheComponent.new';
import type {UpdateQueue} from './ReactUpdateQueue.new';
import {enableSuspenseAvoidThisFallback} from 'shared/ReactFeatureFlags';
import {
enableSuspenseAvoidThisFallback,
enableCPUSuspense,
} from 'shared/ReactFeatureFlags';

import checkPropTypes from 'shared/checkPropTypes';
import {
Expand Down Expand Up @@ -2091,7 +2094,10 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
);
workInProgress.memoizedState = SUSPENDED_MARKER;
return fallbackFragment;
} else if (typeof nextProps.unstable_expectedLoadTime === 'number') {
} else if (
enableCPUSuspense &&
typeof nextProps.unstable_expectedLoadTime === 'number'
) {
// This is a CPU-bound tree. Skip this tree and show a placeholder to
// unblock the surrounding content. Then immediately retry after the
// initial commit.
Expand Down
10 changes: 8 additions & 2 deletions packages/react-reconciler/src/ReactFiberBeginWork.old.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,10 @@ import type {
SpawnedCachePool,
} from './ReactFiberCacheComponent.old';
import type {UpdateQueue} from './ReactUpdateQueue.old';
import {enableSuspenseAvoidThisFallback} from 'shared/ReactFeatureFlags';
import {
enableSuspenseAvoidThisFallback,
enableCPUSuspense,
} from 'shared/ReactFeatureFlags';

import checkPropTypes from 'shared/checkPropTypes';
import {
Expand Down Expand Up @@ -2091,7 +2094,10 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
);
workInProgress.memoizedState = SUSPENDED_MARKER;
return fallbackFragment;
} else if (typeof nextProps.unstable_expectedLoadTime === 'number') {
} else if (
enableCPUSuspense &&
typeof nextProps.unstable_expectedLoadTime === 'number'
) {
// This is a CPU-bound tree. Skip this tree and show a placeholder to
// unblock the surrounding content. Then immediately retry after the
// initial commit.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ describe('DebugTracing', () => {
expect(logs).toEqual(['log: ⚛️ Example resolved']);
});

// @gate experimental && build === 'development' && enableDebugTracing
// @gate experimental && build === 'development' && enableDebugTracing && enableCPUSuspense
it('should log sync render with CPU suspense', () => {
function Example() {
console.log('<Example/>');
Expand Down Expand Up @@ -178,7 +178,7 @@ describe('DebugTracing', () => {
expect(logs).toEqual(['log: ⚛️ Example resolved']);
});

// @gate experimental && build === 'development' && enableDebugTracing
// @gate experimental && build === 'development' && enableDebugTracing && enableCPUSuspense
it('should log concurrent render with CPU suspense', () => {
function Example() {
console.log('<Example/>');
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -108,6 +108,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
}
}

// @gate enableCPUSuspense
it('skips CPU-bound trees on initial mount', async () => {
function App() {
return (
Expand Down Expand Up @@ -145,6 +146,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
);
});

// @gate enableCPUSuspense
it('does not skip CPU-bound trees during updates', async () => {
let setCount;

Expand Down Expand Up @@ -193,6 +195,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
);
});

// @gate enableCPUSuspense
it('suspend inside CPU-bound tree', async () => {
function App() {
return (
Expand Down Expand Up @@ -242,6 +245,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
);
});

// @gate enableCPUSuspense
it('nested CPU-bound trees', async () => {
function App() {
return (
Expand Down
2 changes: 2 additions & 0 deletions packages/shared/ReactFeatureFlags.js
Original file line number Diff line number Diff line change
Expand Up @@ -106,6 +106,8 @@ export const enableSuspenseAvoidThisFallback = false;
// Enables unstable_avoidThisFallback feature in Fizz
export const enableSuspenseAvoidThisFallbackFizz = false;

export const enableCPUSuspense = __EXPERIMENTAL__;

// When a node is unmounted, recurse into the Fiber subtree and clean out
// references. Each level cleans up more fiber fields than the previous level.
// As far as we know, React itself doesn't leak, but because the Fiber contains
Expand Down
1 change: 1 addition & 0 deletions packages/shared/forks/ReactFeatureFlags.native-fb.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@ export const disableModulePatternComponents = false;
export const warnAboutSpreadingKeyToJSX = false;
export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = true;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableComponentStackLocations = false;
Expand Down
1 change: 1 addition & 0 deletions packages/shared/forks/ReactFeatureFlags.native-oss.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ export const disableModulePatternComponents = false;
export const warnAboutSpreadingKeyToJSX = false;
export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableComponentStackLocations = false;
Expand Down
1 change: 1 addition & 0 deletions packages/shared/forks/ReactFeatureFlags.test-renderer.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ export const disableModulePatternComponents = false;
export const warnAboutSpreadingKeyToJSX = false;
export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableComponentStackLocations = true;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ export const enableNewReconciler = false;
export const deferRenderPhaseUpdateToNextBatch = false;
export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableStrictEffects = false;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ export const disableModulePatternComponents = true;
export const warnAboutSpreadingKeyToJSX = false;
export const enableSuspenseAvoidThisFallback = true;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableComponentStackLocations = true;
Expand Down
1 change: 1 addition & 0 deletions packages/shared/forks/ReactFeatureFlags.testing.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ export const disableModulePatternComponents = false;
export const warnAboutSpreadingKeyToJSX = false;
export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableComponentStackLocations = true;
Expand Down
1 change: 1 addition & 0 deletions packages/shared/forks/ReactFeatureFlags.testing.www.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ export const disableModulePatternComponents = true;
export const warnAboutSpreadingKeyToJSX = false;
export const enableSuspenseAvoidThisFallback = true;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = true;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableComponentStackLocations = true;
Expand Down
1 change: 1 addition & 0 deletions packages/shared/forks/ReactFeatureFlags.www.js
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ export const enableUpdaterTracking = __PROFILE__;
export const enableSuspenseLayoutEffectSemantics = true;
export const enableSuspenseAvoidThisFallback = true;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = true;

// Logs additional User Timing API marks for use with an experimental profiling tool.
export const enableSchedulingProfiler =
Expand Down

0 comments on commit 6edd55a

Please sign in to comment.