Skip to content

Commit

Permalink
Split strict effects mode into two flags
Browse files Browse the repository at this point in the history
One flag ('enableStrictEffects') enables strict mode level 2. It is similar to 'debugRenderPhaseSideEffectsForStrictMode' which enables srtict mode level 1.

The second flag ('createRootStrictEffectsByDefault') controls the default strict mode level for 'createRoot' trees. For now, all 'createRoot' trees remain level 1 by default. We will experiment with level 2 within Facebook.

This is a prerequisite for adding a configurable option to 'createRoot' that enables choosing a different StrictMode level than the default.
  • Loading branch information
Brian Vaughn committed Feb 19, 2021
1 parent dd40e13 commit d79faf2
Show file tree
Hide file tree
Showing 24 changed files with 713 additions and 808 deletions.
7 changes: 4 additions & 3 deletions packages/react-reconciler/src/ReactFiber.new.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,9 @@ import type {OffscreenProps} from './ReactFiberOffscreenComponent';

import invariant from 'shared/invariant';
import {
createRootStrictEffectsByDefault,
enableCache,
enableDoubleInvokingEffects,
enableStrictEffects,
enableProfilerTimer,
enableScopeAPI,
} from 'shared/ReactFeatureFlags';
Expand Down Expand Up @@ -423,14 +424,14 @@ export function resetWorkInProgress(workInProgress: Fiber, renderLanes: Lanes) {
export function createHostRootFiber(tag: RootTag): Fiber {
let mode;
if (tag === ConcurrentRoot) {
if (enableDoubleInvokingEffects) {
if (enableStrictEffects && createRootStrictEffectsByDefault) {
mode =
ConcurrentMode | BlockingMode | StrictLegacyMode | StrictEffectsMode;
} else {
mode = ConcurrentMode | BlockingMode | StrictLegacyMode;
}
} else if (tag === BlockingRoot) {
if (enableDoubleInvokingEffects) {
if (enableStrictEffects && createRootStrictEffectsByDefault) {
mode = BlockingMode | StrictLegacyMode | StrictEffectsMode;
} else {
mode = BlockingMode | StrictLegacyMode;
Expand Down
7 changes: 4 additions & 3 deletions packages/react-reconciler/src/ReactFiber.old.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,9 @@ import type {OffscreenProps} from './ReactFiberOffscreenComponent';

import invariant from 'shared/invariant';
import {
createRootStrictEffectsByDefault,
enableCache,
enableDoubleInvokingEffects,
enableStrictEffects,
enableProfilerTimer,
enableScopeAPI,
} from 'shared/ReactFeatureFlags';
Expand Down Expand Up @@ -423,14 +424,14 @@ export function resetWorkInProgress(workInProgress: Fiber, renderLanes: Lanes) {
export function createHostRootFiber(tag: RootTag): Fiber {
let mode;
if (tag === ConcurrentRoot) {
if (enableDoubleInvokingEffects) {
if (enableStrictEffects && createRootStrictEffectsByDefault) {
mode =
ConcurrentMode | BlockingMode | StrictLegacyMode | StrictEffectsMode;
} else {
mode = ConcurrentMode | BlockingMode | StrictLegacyMode;
}
} else if (tag === BlockingRoot) {
if (enableDoubleInvokingEffects) {
if (enableStrictEffects && createRootStrictEffectsByDefault) {
mode = BlockingMode | StrictLegacyMode | StrictEffectsMode;
} else {
mode = BlockingMode | StrictLegacyMode;
Expand Down
10 changes: 5 additions & 5 deletions packages/react-reconciler/src/ReactFiberClassComponent.new.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ import {
enableDebugTracing,
enableSchedulingProfiler,
warnAboutDeprecatedLifecycles,
enableDoubleInvokingEffects,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';
import ReactStrictModeWarnings from './ReactStrictModeWarnings.new';
import {isMounted} from './ReactFiberTreeReflection';
Expand Down Expand Up @@ -908,7 +908,7 @@ function mountClassInstance(
if (typeof instance.componentDidMount === 'function') {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
Expand Down Expand Up @@ -987,7 +987,7 @@ function resumeMountClassInstance(
if (typeof instance.componentDidMount === 'function') {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
Expand Down Expand Up @@ -1039,7 +1039,7 @@ function resumeMountClassInstance(
if (typeof instance.componentDidMount === 'function') {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
Expand All @@ -1054,7 +1054,7 @@ function resumeMountClassInstance(
if (typeof instance.componentDidMount === 'function') {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
Expand Down
10 changes: 5 additions & 5 deletions packages/react-reconciler/src/ReactFiberClassComponent.old.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ import {
enableDebugTracing,
enableSchedulingProfiler,
warnAboutDeprecatedLifecycles,
enableDoubleInvokingEffects,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';
import ReactStrictModeWarnings from './ReactStrictModeWarnings.old';
import {isMounted} from './ReactFiberTreeReflection';
Expand Down Expand Up @@ -908,7 +908,7 @@ function mountClassInstance(
if (typeof instance.componentDidMount === 'function') {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
Expand Down Expand Up @@ -987,7 +987,7 @@ function resumeMountClassInstance(
if (typeof instance.componentDidMount === 'function') {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
Expand Down Expand Up @@ -1039,7 +1039,7 @@ function resumeMountClassInstance(
if (typeof instance.componentDidMount === 'function') {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
Expand All @@ -1054,7 +1054,7 @@ function resumeMountClassInstance(
if (typeof instance.componentDidMount === 'function') {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
Expand Down
10 changes: 5 additions & 5 deletions packages/react-reconciler/src/ReactFiberCommitWork.new.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ import {
enableSuspenseServerRenderer,
enableSuspenseCallback,
enableScopeAPI,
enableDoubleInvokingEffects,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';
import {
FunctionComponent,
Expand Down Expand Up @@ -2475,7 +2475,7 @@ function ensureCorrectReturnPointer(fiber, expectedReturnFiber) {
}

function invokeLayoutEffectMountInDEV(fiber: Fiber): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
Expand Down Expand Up @@ -2509,7 +2509,7 @@ function invokeLayoutEffectMountInDEV(fiber: Fiber): void {
}

function invokePassiveEffectMountInDEV(fiber: Fiber): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
Expand All @@ -2534,7 +2534,7 @@ function invokePassiveEffectMountInDEV(fiber: Fiber): void {
}

function invokeLayoutEffectUnmountInDEV(fiber: Fiber): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
Expand Down Expand Up @@ -2578,7 +2578,7 @@ function invokeLayoutEffectUnmountInDEV(fiber: Fiber): void {
}

function invokePassiveEffectUnmountInDEV(fiber: Fiber): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
Expand Down
10 changes: 5 additions & 5 deletions packages/react-reconciler/src/ReactFiberCommitWork.old.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ import {
enableSuspenseServerRenderer,
enableSuspenseCallback,
enableScopeAPI,
enableDoubleInvokingEffects,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';
import {
FunctionComponent,
Expand Down Expand Up @@ -2475,7 +2475,7 @@ function ensureCorrectReturnPointer(fiber, expectedReturnFiber) {
}

function invokeLayoutEffectMountInDEV(fiber: Fiber): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
Expand Down Expand Up @@ -2509,7 +2509,7 @@ function invokeLayoutEffectMountInDEV(fiber: Fiber): void {
}

function invokePassiveEffectMountInDEV(fiber: Fiber): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
Expand All @@ -2534,7 +2534,7 @@ function invokePassiveEffectMountInDEV(fiber: Fiber): void {
}

function invokeLayoutEffectUnmountInDEV(fiber: Fiber): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
Expand Down Expand Up @@ -2578,7 +2578,7 @@ function invokeLayoutEffectUnmountInDEV(fiber: Fiber): void {
}

function invokePassiveEffectUnmountInDEV(fiber: Fiber): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
Expand Down
12 changes: 6 additions & 6 deletions packages/react-reconciler/src/ReactFiberHooks.new.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ import {
enableCache,
decoupleUpdatePriorityFromScheduler,
enableUseRefAccessWarning,
enableDoubleInvokingEffects,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';

import {
Expand Down Expand Up @@ -509,7 +509,7 @@ export function bailoutHooks(
// complete phase (bubbleProperties).
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
workInProgress.flags &= ~(
Expand Down Expand Up @@ -1423,7 +1423,7 @@ function mountEffect(
}
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(currentlyRenderingFiber.mode & StrictEffectsMode) !== NoMode
) {
return mountEffectImpl(
Expand Down Expand Up @@ -1461,7 +1461,7 @@ function mountLayoutEffect(
): void {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(currentlyRenderingFiber.mode & StrictEffectsMode) !== NoMode
) {
return mountEffectImpl(
Expand Down Expand Up @@ -1533,7 +1533,7 @@ function mountImperativeHandle<T>(

if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(currentlyRenderingFiber.mode & StrictEffectsMode) !== NoMode
) {
return mountEffectImpl(
Expand Down Expand Up @@ -1832,7 +1832,7 @@ function mountOpaqueIdentifier(): OpaqueIDType | void {
if ((currentlyRenderingFiber.mode & BlockingMode) === NoMode) {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(currentlyRenderingFiber.mode & StrictEffectsMode) === NoMode
) {
currentlyRenderingFiber.flags |= MountPassiveDevEffect | PassiveEffect;
Expand Down
12 changes: 6 additions & 6 deletions packages/react-reconciler/src/ReactFiberHooks.old.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ import {
enableCache,
decoupleUpdatePriorityFromScheduler,
enableUseRefAccessWarning,
enableDoubleInvokingEffects,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';

import {
Expand Down Expand Up @@ -509,7 +509,7 @@ export function bailoutHooks(
// complete phase (bubbleProperties).
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
workInProgress.flags &= ~(
Expand Down Expand Up @@ -1423,7 +1423,7 @@ function mountEffect(
}
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(currentlyRenderingFiber.mode & StrictEffectsMode) !== NoMode
) {
return mountEffectImpl(
Expand Down Expand Up @@ -1461,7 +1461,7 @@ function mountLayoutEffect(
): void {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(currentlyRenderingFiber.mode & StrictEffectsMode) !== NoMode
) {
return mountEffectImpl(
Expand Down Expand Up @@ -1533,7 +1533,7 @@ function mountImperativeHandle<T>(

if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(currentlyRenderingFiber.mode & StrictEffectsMode) !== NoMode
) {
return mountEffectImpl(
Expand Down Expand Up @@ -1832,7 +1832,7 @@ function mountOpaqueIdentifier(): OpaqueIDType | void {
if ((currentlyRenderingFiber.mode & BlockingMode) === NoMode) {
if (
__DEV__ &&
enableDoubleInvokingEffects &&
enableStrictEffects &&
(currentlyRenderingFiber.mode & StrictEffectsMode) === NoMode
) {
currentlyRenderingFiber.flags |= MountPassiveDevEffect | PassiveEffect;
Expand Down
10 changes: 5 additions & 5 deletions packages/react-reconciler/src/ReactFiberWorkLoop.new.js
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ import {
enableDebugTracing,
enableSchedulingProfiler,
disableSchedulerTimeoutInWorkLoop,
enableDoubleInvokingEffects,
enableStrictEffects,
skipUnmountedBoundaries,
enableNativeEventPriorityInference,
} from 'shared/ReactFeatureFlags';
Expand Down Expand Up @@ -2071,7 +2071,7 @@ function commitRootImpl(root, renderPriorityLevel) {
legacyErrorBoundariesThatAlreadyFailed = null;
}

if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
if (!rootDidHavePassiveEffects) {
commitDoubleInvokeEffectsInDEV(root.current, false);
}
Expand Down Expand Up @@ -2258,7 +2258,7 @@ function flushPassiveEffectsImpl() {
markPassiveEffectsStopped();
}

if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
commitDoubleInvokeEffectsInDEV(root.current, true);
}

Expand Down Expand Up @@ -2561,7 +2561,7 @@ function commitDoubleInvokeEffectsInDEV(
fiber: Fiber,
hasPassiveEffects: boolean,
) {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// Never double-invoke effects outside of StrictEffectsMode.
if ((fiber.mode & StrictEffectsMode) === NoMode) {
return;
Expand Down Expand Up @@ -2590,7 +2590,7 @@ function invokeEffectsInDev(
fiberFlags: Flags,
invokeEffectFn: (fiber: Fiber) => void,
): void {
if (__DEV__ && enableDoubleInvokingEffects) {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.

Expand Down
Loading

0 comments on commit d79faf2

Please sign in to comment.