Skip to content

Commit

Permalink
Land enableSuspenseLayoutEffectSemantics flag
Browse files Browse the repository at this point in the history 
This was released to open source in 18.0 and is already hardcoded to
true in www.
  • Loading branch information
@acdlite
acdlite committed Jun 12, 2022
1 parent 8186b19 commit 1a98da8
Show file tree
Hide file tree
Showing 24 changed files with 59 additions and 219 deletions.
5 changes: 1 addition & 4 deletions packages/react-reconciler/src/ReactFiberBeginWork.new.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,6 @@ import {
enableScopeAPI,
enableCache,
enableLazyContextPropagation,
enableSuspenseLayoutEffectSemantics,
enableSchedulingProfiler,
enableTransitionTracing,
enableLegacyHidden,
Expand Down Expand Up @@ -942,9 +941,7 @@ function markRef(current: Fiber | null, workInProgress: Fiber) {
) {
// Schedule a Ref effect
workInProgress.flags |= Ref;
if (enableSuspenseLayoutEffectSemantics) {
workInProgress.flags |= RefStatic;
}
workInProgress.flags |= RefStatic;
}
}

Expand Down
5 changes: 1 addition & 4 deletions packages/react-reconciler/src/ReactFiberBeginWork.old.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,6 @@ import {
enableScopeAPI,
enableCache,
enableLazyContextPropagation,
enableSuspenseLayoutEffectSemantics,
enableSchedulingProfiler,
enableTransitionTracing,
enableLegacyHidden,
Expand Down Expand Up @@ -942,9 +941,7 @@ function markRef(current: Fiber | null, workInProgress: Fiber) {
) {
// Schedule a Ref effect
workInProgress.flags |= Ref;
if (enableSuspenseLayoutEffectSemantics) {
workInProgress.flags |= RefStatic;
}
workInProgress.flags |= RefStatic;
}
}

Expand Down
21 changes: 4 additions & 17 deletions packages/react-reconciler/src/ReactFiberClassComponent.new.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,6 @@ import {
warnAboutDeprecatedLifecycles,
enableStrictEffects,
enableLazyContextPropagation,
enableSuspenseLayoutEffectSemantics,
} from 'shared/ReactFeatureFlags';
import ReactStrictModeWarnings from './ReactStrictModeWarnings.new';
import {isMounted} from './ReactFiberTreeReflection';
Expand Down Expand Up @@ -908,10 +907,7 @@ function mountClassInstance(
}

if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
Expand Down Expand Up @@ -989,10 +985,7 @@ function resumeMountClassInstance(
// If an update was already in progress, we should schedule an Update
// effect even though we're bailing out, so that cWU/cDU are called.
if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
Expand Down Expand Up @@ -1043,10 +1036,7 @@ function resumeMountClassInstance(
}
}
if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
Expand All @@ -1060,10 +1050,7 @@ function resumeMountClassInstance(
// If an update was already in progress, we should schedule an Update
// effect even though we're bailing out, so that cWU/cDU are called.
if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
Expand Down
21 changes: 4 additions & 17 deletions packages/react-reconciler/src/ReactFiberClassComponent.old.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,6 @@ import {
warnAboutDeprecatedLifecycles,
enableStrictEffects,
enableLazyContextPropagation,
enableSuspenseLayoutEffectSemantics,
} from 'shared/ReactFeatureFlags';
import ReactStrictModeWarnings from './ReactStrictModeWarnings.old';
import {isMounted} from './ReactFiberTreeReflection';
Expand Down Expand Up @@ -908,10 +907,7 @@ function mountClassInstance(
}

if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
Expand Down Expand Up @@ -989,10 +985,7 @@ function resumeMountClassInstance(
// If an update was already in progress, we should schedule an Update
// effect even though we're bailing out, so that cWU/cDU are called.
if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
Expand Down Expand Up @@ -1043,10 +1036,7 @@ function resumeMountClassInstance(
}
}
if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
Expand All @@ -1060,10 +1050,7 @@ function resumeMountClassInstance(
// If an update was already in progress, we should schedule an Update
// effect even though we're bailing out, so that cWU/cDU are called.
if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
Expand Down
55 changes: 18 additions & 37 deletions packages/react-reconciler/src/ReactFiberCommitWork.new.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,6 @@ import {
enableScopeAPI,
enableStrictEffects,
deletedTreeCleanUpLevel,
enableSuspenseLayoutEffectSemantics,
enableUpdaterTracking,
enableCache,
enableTransitionTracing,
Expand Down Expand Up @@ -173,7 +172,6 @@ if (__DEV__) {

// Used during the commit phase to track the state of the Offscreen component stack.
// Allows us to avoid traversing the return path to find the nearest Offscreen ancestor.
// Only used when enableSuspenseLayoutEffectSemantics is enabled.
let offscreenSubtreeIsHidden: boolean = false;
let offscreenSubtreeWasHidden: boolean = false;

Expand Down Expand Up @@ -710,10 +708,7 @@ function commitLayoutEffectOnFiber(
case FunctionComponent:
case ForwardRef:
case SimpleMemoComponent: {
if (
!enableSuspenseLayoutEffectSemantics ||
!offscreenSubtreeWasHidden
) {
if (!offscreenSubtreeWasHidden) {
// At this point layout effects have already been destroyed (during mutation phase).
// This is done to prevent sibling component effects from interfering with each other,
// e.g. a destroy function in one component should never override a ref set
Expand Down Expand Up @@ -1018,7 +1013,7 @@ function commitLayoutEffectOnFiber(
}
}

if (!enableSuspenseLayoutEffectSemantics || !offscreenSubtreeWasHidden) {
if (!offscreenSubtreeWasHidden) {
if (enableScopeAPI) {
// TODO: This is a temporary solution that allowed us to transition away
// from React Flare on www.
Expand Down Expand Up @@ -1889,11 +1884,7 @@ function commitDeletionEffectsOnFiber(
return;
}
case OffscreenComponent: {
if (
// TODO: Remove this dead flag
enableSuspenseLayoutEffectSemantics &&
deletedFiber.mode & ConcurrentMode
) {
if (deletedFiber.mode & ConcurrentMode) {
// If this offscreen component is hidden, we already unmounted it. Before
// deleting the children, track that it's already unmounted so that we
// don't attempt to unmount the effects again.
Expand Down Expand Up @@ -2341,11 +2332,7 @@ function commitMutationEffectsOnFiber(
case OffscreenComponent: {
const wasHidden = current !== null && current.memoizedState !== null;

if (
// TODO: Remove this dead flag
enableSuspenseLayoutEffectSemantics &&
finishedWork.mode & ConcurrentMode
) {
if (finishedWork.mode & ConcurrentMode) {
// Before committing the children, track on the stack whether this
// offscreen subtree was already hidden, so that we don't unmount the
// effects again.
Expand All @@ -2369,23 +2356,21 @@ function commitMutationEffectsOnFiber(
// read it during an event
offscreenInstance.isHidden = isHidden;

if (enableSuspenseLayoutEffectSemantics) {
if (isHidden) {
if (!wasHidden) {
if ((offscreenBoundary.mode & ConcurrentMode) !== NoMode) {
nextEffect = offscreenBoundary;
let offscreenChild = offscreenBoundary.child;
while (offscreenChild !== null) {
nextEffect = offscreenChild;
disappearLayoutEffects_begin(offscreenChild);
offscreenChild = offscreenChild.sibling;
}
if (isHidden) {
if (!wasHidden) {
if ((offscreenBoundary.mode & ConcurrentMode) !== NoMode) {
nextEffect = offscreenBoundary;
let offscreenChild = offscreenBoundary.child;
while (offscreenChild !== null) {
nextEffect = offscreenChild;
disappearLayoutEffects_begin(offscreenChild);
offscreenChild = offscreenChild.sibling;
}
}
} else {
if (wasHidden) {
// TODO: Move re-appear call here for symmetry?
}
}
} else {
if (wasHidden) {
// TODO: Move re-appear call here for symmetry?
}
}

Expand Down Expand Up @@ -2483,11 +2468,7 @@ function commitLayoutEffects_begin(
const fiber = nextEffect;
const firstChild = fiber.child;

if (
enableSuspenseLayoutEffectSemantics &&
fiber.tag === OffscreenComponent &&
isModernRoot
) {
if (fiber.tag === OffscreenComponent && isModernRoot) {
// Keep track of the current Offscreen stack's state.
const isHidden = fiber.memoizedState !== null;
const newOffscreenSubtreeIsHidden = isHidden || offscreenSubtreeIsHidden;
Expand Down
55 changes: 18 additions & 37 deletions packages/react-reconciler/src/ReactFiberCommitWork.old.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,6 @@ import {
enableScopeAPI,
enableStrictEffects,
deletedTreeCleanUpLevel,
enableSuspenseLayoutEffectSemantics,
enableUpdaterTracking,
enableCache,
enableTransitionTracing,
Expand Down Expand Up @@ -173,7 +172,6 @@ if (__DEV__) {

// Used during the commit phase to track the state of the Offscreen component stack.
// Allows us to avoid traversing the return path to find the nearest Offscreen ancestor.
// Only used when enableSuspenseLayoutEffectSemantics is enabled.
let offscreenSubtreeIsHidden: boolean = false;
let offscreenSubtreeWasHidden: boolean = false;

Expand Down Expand Up @@ -710,10 +708,7 @@ function commitLayoutEffectOnFiber(
case FunctionComponent:
case ForwardRef:
case SimpleMemoComponent: {
if (
!enableSuspenseLayoutEffectSemantics ||
!offscreenSubtreeWasHidden
) {
if (!offscreenSubtreeWasHidden) {
// At this point layout effects have already been destroyed (during mutation phase).
// This is done to prevent sibling component effects from interfering with each other,
// e.g. a destroy function in one component should never override a ref set
Expand Down Expand Up @@ -1018,7 +1013,7 @@ function commitLayoutEffectOnFiber(
}
}

if (!enableSuspenseLayoutEffectSemantics || !offscreenSubtreeWasHidden) {
if (!offscreenSubtreeWasHidden) {
if (enableScopeAPI) {
// TODO: This is a temporary solution that allowed us to transition away
// from React Flare on www.
Expand Down Expand Up @@ -1889,11 +1884,7 @@ function commitDeletionEffectsOnFiber(
return;
}
case OffscreenComponent: {
if (
// TODO: Remove this dead flag
enableSuspenseLayoutEffectSemantics &&
deletedFiber.mode & ConcurrentMode
) {
if (deletedFiber.mode & ConcurrentMode) {
// If this offscreen component is hidden, we already unmounted it. Before
// deleting the children, track that it's already unmounted so that we
// don't attempt to unmount the effects again.
Expand Down Expand Up @@ -2341,11 +2332,7 @@ function commitMutationEffectsOnFiber(
case OffscreenComponent: {
const wasHidden = current !== null && current.memoizedState !== null;

if (
// TODO: Remove this dead flag
enableSuspenseLayoutEffectSemantics &&
finishedWork.mode & ConcurrentMode
) {
if (finishedWork.mode & ConcurrentMode) {
// Before committing the children, track on the stack whether this
// offscreen subtree was already hidden, so that we don't unmount the
// effects again.
Expand All @@ -2369,23 +2356,21 @@ function commitMutationEffectsOnFiber(
// read it during an event
offscreenInstance.isHidden = isHidden;

if (enableSuspenseLayoutEffectSemantics) {
if (isHidden) {
if (!wasHidden) {
if ((offscreenBoundary.mode & ConcurrentMode) !== NoMode) {
nextEffect = offscreenBoundary;
let offscreenChild = offscreenBoundary.child;
while (offscreenChild !== null) {
nextEffect = offscreenChild;
disappearLayoutEffects_begin(offscreenChild);
offscreenChild = offscreenChild.sibling;
}
if (isHidden) {
if (!wasHidden) {
if ((offscreenBoundary.mode & ConcurrentMode) !== NoMode) {
nextEffect = offscreenBoundary;
let offscreenChild = offscreenBoundary.child;
while (offscreenChild !== null) {
nextEffect = offscreenChild;
disappearLayoutEffects_begin(offscreenChild);
offscreenChild = offscreenChild.sibling;
}
}
} else {
if (wasHidden) {
// TODO: Move re-appear call here for symmetry?
}
}
} else {
if (wasHidden) {
// TODO: Move re-appear call here for symmetry?
}
}

Expand Down Expand Up @@ -2483,11 +2468,7 @@ function commitLayoutEffects_begin(
const fiber = nextEffect;
const firstChild = fiber.child;

if (
enableSuspenseLayoutEffectSemantics &&
fiber.tag === OffscreenComponent &&
isModernRoot
) {
if (fiber.tag === OffscreenComponent && isModernRoot) {
// Keep track of the current Offscreen stack's state.
const isHidden = fiber.memoizedState !== null;
const newOffscreenSubtreeIsHidden = isHidden || offscreenSubtreeIsHidden;
Expand Down
6 changes: 1 addition & 5 deletions packages/react-reconciler/src/ReactFiberCompleteWork.new.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,6 @@ import {
enableScopeAPI,
enableProfilerTimer,
enableCache,
enableSuspenseLayoutEffectSemantics,
enableTransitionTracing,
} from 'shared/ReactFeatureFlags';
import {
Expand Down Expand Up @@ -173,10 +172,7 @@ function markUpdate(workInProgress: Fiber) {
}

function markRef(workInProgress: Fiber) {
workInProgress.flags |= Ref;
if (enableSuspenseLayoutEffectSemantics) {
workInProgress.flags |= RefStatic;
}
workInProgress.flags |= Ref | RefStatic;
}

function hadNoMutationsEffects(current: null | Fiber, completedWork: Fiber) {
Expand Down
Loading

0 comments on commit 1a98da8

Please sign in to comment.