Skip to content

Commit

Permalink
New Suspense layout effects semantics
Browse files Browse the repository at this point in the history
  • Loading branch information
Brian Vaughn committed Mar 30, 2021
1 parent 09a304f commit 1ad6bb7
Show file tree
Hide file tree
Showing 12 changed files with 698 additions and 116 deletions.
5 changes: 5 additions & 0 deletions packages/react-reconciler/src/ReactFiberBeginWork.new.js
Expand Up @@ -66,6 +66,7 @@ import {
DidCapture,
Update,
Ref,
RefStatic,
ChildDeletion,
ForceUpdateForLegacySuspense,
StaticMask,
Expand All @@ -83,6 +84,7 @@ import {
enableScopeAPI,
enableCache,
enableLazyContextPropagation,
enableSuspenseLayoutEffectSemantics,
} from 'shared/ReactFeatureFlags';
import invariant from 'shared/invariant';
import shallowEqual from 'shared/shallowEqual';
Expand Down Expand Up @@ -854,6 +856,9 @@ function markRef(current: Fiber | null, workInProgress: Fiber) {
) {
// Schedule a Ref effect
workInProgress.flags |= Ref;
if (enableSuspenseLayoutEffectSemantics) {
workInProgress.flags |= RefStatic;
}
}
}

Expand Down
5 changes: 5 additions & 0 deletions packages/react-reconciler/src/ReactFiberBeginWork.old.js
Expand Up @@ -66,6 +66,7 @@ import {
DidCapture,
Update,
Ref,
RefStatic,
ChildDeletion,
ForceUpdateForLegacySuspense,
StaticMask,
Expand All @@ -83,6 +84,7 @@ import {
enableScopeAPI,
enableCache,
enableLazyContextPropagation,
enableSuspenseLayoutEffectSemantics,
} from 'shared/ReactFeatureFlags';
import invariant from 'shared/invariant';
import shallowEqual from 'shared/shallowEqual';
Expand Down Expand Up @@ -854,6 +856,9 @@ function markRef(current: Fiber | null, workInProgress: Fiber) {
) {
// Schedule a Ref effect
workInProgress.flags |= Ref;
if (enableSuspenseLayoutEffectSemantics) {
workInProgress.flags |= RefStatic;
}
}
}

Expand Down
45 changes: 32 additions & 13 deletions packages/react-reconciler/src/ReactFiberClassComponent.new.js
Expand Up @@ -10,9 +10,15 @@
import type {Fiber} from './ReactInternalTypes';
import type {Lanes} from './ReactFiberLane.new';
import type {UpdateQueue} from './ReactUpdateQueue.new';
import type {Flags} from './ReactFiberFlags';

import * as React from 'react';
import {MountLayoutDev, Update, Snapshot} from './ReactFiberFlags';
import {
LayoutStatic,
MountLayoutDev,
Update,
Snapshot,
} from './ReactFiberFlags';
import {
debugRenderPhaseSideEffectsForStrictMode,
disableLegacyContext,
Expand All @@ -21,6 +27,7 @@ import {
warnAboutDeprecatedLifecycles,
enableStrictEffects,
enableLazyContextPropagation,
enableSuspenseLayoutEffectSemantics,
} from 'shared/ReactFeatureFlags';
import ReactStrictModeWarnings from './ReactStrictModeWarnings.new';
import {isMounted} from './ReactFiberTreeReflection';
Expand Down Expand Up @@ -908,16 +915,19 @@ function mountClassInstance(
}

if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
workInProgress.flags |= MountLayoutDev | Update;
} else {
workInProgress.flags |= Update;
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
}

Expand Down Expand Up @@ -987,16 +997,19 @@ 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;
}
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
workInProgress.flags |= MountLayoutDev | Update;
} else {
workInProgress.flags |= Update;
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
return false;
}
Expand Down Expand Up @@ -1039,31 +1052,37 @@ function resumeMountClassInstance(
}
}
if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
workInProgress.flags |= MountLayoutDev | Update;
} else {
workInProgress.flags |= Update;
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
} else {
// 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;
}
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
workInProgress.flags |= MountLayoutDev | Update;
} else {
workInProgress.flags |= Update;
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}

// If shouldComponentUpdate returned false, we should still update the
Expand Down
45 changes: 32 additions & 13 deletions packages/react-reconciler/src/ReactFiberClassComponent.old.js
Expand Up @@ -10,9 +10,15 @@
import type {Fiber} from './ReactInternalTypes';
import type {Lanes} from './ReactFiberLane.old';
import type {UpdateQueue} from './ReactUpdateQueue.old';
import type {Flags} from './ReactFiberFlags';

import * as React from 'react';
import {MountLayoutDev, Update, Snapshot} from './ReactFiberFlags';
import {
LayoutStatic,
MountLayoutDev,
Update,
Snapshot,
} from './ReactFiberFlags';
import {
debugRenderPhaseSideEffectsForStrictMode,
disableLegacyContext,
Expand All @@ -21,6 +27,7 @@ import {
warnAboutDeprecatedLifecycles,
enableStrictEffects,
enableLazyContextPropagation,
enableSuspenseLayoutEffectSemantics,
} from 'shared/ReactFeatureFlags';
import ReactStrictModeWarnings from './ReactStrictModeWarnings.old';
import {isMounted} from './ReactFiberTreeReflection';
Expand Down Expand Up @@ -908,16 +915,19 @@ function mountClassInstance(
}

if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
workInProgress.flags |= MountLayoutDev | Update;
} else {
workInProgress.flags |= Update;
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
}

Expand Down Expand Up @@ -987,16 +997,19 @@ 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;
}
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
workInProgress.flags |= MountLayoutDev | Update;
} else {
workInProgress.flags |= Update;
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
return false;
}
Expand Down Expand Up @@ -1039,31 +1052,37 @@ function resumeMountClassInstance(
}
}
if (typeof instance.componentDidMount === 'function') {
let fiberFlags: Flags = Update;
if (enableSuspenseLayoutEffectSemantics) {
fiberFlags |= LayoutStatic;
}
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
workInProgress.flags |= MountLayoutDev | Update;
} else {
workInProgress.flags |= Update;
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
} else {
// 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;
}
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
// Never double-invoke effects for legacy roots.
workInProgress.flags |= MountLayoutDev | Update;
} else {
workInProgress.flags |= Update;
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}

// If shouldComponentUpdate returned false, we should still update the
Expand Down

0 comments on commit 1ad6bb7

Please sign in to comment.