Skip to content

Commit 02da938

Browse files
author
Brian Vaughn
authored
Don't double-invoke effects in legacy roots (#20028)
Large legacy applications are likely to be difficult to update to handle this feature, and it wouldn't add any value– since newer APIs that require this resilience are not legacy compatible.
1 parent d95c493 commit 02da938

6 files changed

+193
-56
lines changed

‎packages/react-reconciler/src/ReactFiberClassComponent.new.js

+28-5
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,13 @@ import invariant from 'shared/invariant';
3030
import{REACT_CONTEXT_TYPE,REACT_PROVIDER_TYPE}from'shared/ReactSymbols';
3131

3232
import{resolveDefaultProps}from'./ReactFiberLazyComponent.new';
33-
import{DebugTracingMode,StrictMode}from'./ReactTypeOfMode';
33+
import{
34+
BlockingMode,
35+
ConcurrentMode,
36+
DebugTracingMode,
37+
NoMode,
38+
StrictMode,
39+
}from'./ReactTypeOfMode';
3440

3541
import{
3642
enqueueUpdate,
@@ -891,7 +897,12 @@ function mountClassInstance(
891897
}
892898

893899
if(typeofinstance.componentDidMount==='function'){
894-
if(__DEV__&&enableDoubleInvokingEffects){
900+
if(
901+
__DEV__&&
902+
enableDoubleInvokingEffects&&
903+
(workInProgress.mode&(BlockingMode|ConcurrentMode))!==NoMode
904+
){
905+
// Never double-invoke effects for legacy roots.
895906
workInProgress.flags|=MountLayoutDev|Update;
896907
}else{
897908
workInProgress.flags|=Update;
@@ -965,7 +976,11 @@ function resumeMountClassInstance(
965976
// If an update was already in progress, we should schedule an Update
966977
// effect even though we're bailing out, so that cWU/cDU are called.
967978
if(typeofinstance.componentDidMount==='function'){
968-
if(__DEV__&&enableDoubleInvokingEffects){
979+
if(
980+
__DEV__&&
981+
enableDoubleInvokingEffects&&
982+
(workInProgress.mode&(BlockingMode|ConcurrentMode))!==NoMode
983+
){
969984
workInProgress.flags|=MountLayoutDev|Update;
970985
}else{
971986
workInProgress.flags|=Update;
@@ -1012,7 +1027,11 @@ function resumeMountClassInstance(
10121027
}
10131028
}
10141029
if(typeofinstance.componentDidMount==='function'){
1015-
if(__DEV__&&enableDoubleInvokingEffects){
1030+
if(
1031+
__DEV__&&
1032+
enableDoubleInvokingEffects&&
1033+
(workInProgress.mode&(BlockingMode|ConcurrentMode))!==NoMode
1034+
){
10161035
workInProgress.flags|=MountLayoutDev|Update;
10171036
}else{
10181037
workInProgress.flags|=Update;
@@ -1022,7 +1041,11 @@ function resumeMountClassInstance(
10221041
// If an update was already in progress, we should schedule an Update
10231042
// effect even though we're bailing out, so that cWU/cDU are called.
10241043
if(typeofinstance.componentDidMount==='function'){
1025-
if(__DEV__&&enableDoubleInvokingEffects){
1044+
if(
1045+
__DEV__&&
1046+
enableDoubleInvokingEffects&&
1047+
(workInProgress.mode&(BlockingMode|ConcurrentMode))!==NoMode
1048+
){
10261049
workInProgress.flags|=MountLayoutDev|Update;
10271050
}else{
10281051
workInProgress.flags|=Update;

‎packages/react-reconciler/src/ReactFiberCommitWork.new.js

+8
Original file line numberDiff line numberDiff line change
@@ -2024,6 +2024,8 @@ function commitPassiveMount(
20242024

20252025
functioninvokeLayoutEffectMountInDEV(fiber: Fiber): void{
20262026
if(__DEV__&&enableDoubleInvokingEffects){
2027+
// We don't need to re-check for legacy roots here.
2028+
// This function will not be called within legacy roots.
20272029
switch(fiber.tag){
20282030
caseFunctionComponent:
20292031
caseForwardRef:
@@ -2057,6 +2059,8 @@ function invokeLayoutEffectMountInDEV(fiber: Fiber): void {
20572059

20582060
functioninvokePassiveEffectMountInDEV(fiber: Fiber): void{
20592061
if(__DEV__&&enableDoubleInvokingEffects){
2062+
// We don't need to re-check for legacy roots here.
2063+
// This function will not be called within legacy roots.
20602064
switch(fiber.tag){
20612065
caseFunctionComponent:
20622066
caseForwardRef:
@@ -2081,6 +2085,8 @@ function invokePassiveEffectMountInDEV(fiber: Fiber): void {
20812085

20822086
functioninvokeLayoutEffectUnmountInDEV(fiber: Fiber): void{
20832087
if(__DEV__&&enableDoubleInvokingEffects){
2088+
// We don't need to re-check for legacy roots here.
2089+
// This function will not be called within legacy roots.
20842090
switch(fiber.tag){
20852091
caseFunctionComponent:
20862092
caseForwardRef:
@@ -2113,6 +2119,8 @@ function invokeLayoutEffectUnmountInDEV(fiber: Fiber): void {
21132119

21142120
functioninvokePassiveEffectUnmountInDEV(fiber: Fiber): void{
21152121
if(__DEV__&&enableDoubleInvokingEffects){
2122+
// We don't need to re-check for legacy roots here.
2123+
// This function will not be called within legacy roots.
21162124
switch(fiber.tag){
21172125
caseFunctionComponent:
21182126
caseForwardRef:

‎packages/react-reconciler/src/ReactFiberHooks.new.js

+26-5
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,12 @@ import {
2929
enableDoubleInvokingEffects,
3030
}from'shared/ReactFeatureFlags';
3131

32-
import{NoMode,BlockingMode,DebugTracingMode}from'./ReactTypeOfMode';
32+
import{
33+
NoMode,
34+
BlockingMode,
35+
ConcurrentMode,
36+
DebugTracingMode,
37+
}from'./ReactTypeOfMode';
3338
import{
3439
NoLane,
3540
NoLanes,
@@ -485,7 +490,11 @@ export function bailoutHooks(
485490
lanes: Lanes,
486491
){
487492
workInProgress.updateQueue=current.updateQueue;
488-
if(__DEV__&&enableDoubleInvokingEffects){
493+
if(
494+
__DEV__&&
495+
enableDoubleInvokingEffects&&
496+
(workInProgress.mode&(BlockingMode|ConcurrentMode))!==NoMode
497+
){
489498
workInProgress.flags&=~(
490499
MountPassiveDevEffect|
491500
PassiveEffect|
@@ -1253,7 +1262,11 @@ function mountEffect(
12531262
}
12541263
}
12551264

1256-
if(__DEV__&&enableDoubleInvokingEffects){
1265+
if(
1266+
__DEV__&&
1267+
enableDoubleInvokingEffects&&
1268+
(currentlyRenderingFiber.mode&(BlockingMode|ConcurrentMode))!==NoMode
1269+
){
12571270
returnmountEffectImpl(
12581271
MountPassiveDevEffect|PassiveEffect|PassiveStaticEffect,
12591272
HookPassive,
@@ -1287,7 +1300,11 @@ function mountLayoutEffect(
12871300
create: ()=>(()=>void)|void,
12881301
deps: Array<mixed>|void|null,
12891302
): void{
1290-
if(__DEV__&&enableDoubleInvokingEffects){
1303+
if(
1304+
__DEV__&&
1305+
enableDoubleInvokingEffects&&
1306+
(currentlyRenderingFiber.mode&(BlockingMode|ConcurrentMode))!==NoMode
1307+
){
12911308
returnmountEffectImpl(
12921309
MountLayoutDevEffect|UpdateEffect,
12931310
HookLayout,
@@ -1355,7 +1372,11 @@ function mountImperativeHandle<T>(
13551372
consteffectDeps=
13561373
deps!==null&&deps!==undefined ? deps.concat([ref]) : null;
13571374

1358-
if(__DEV__&&enableDoubleInvokingEffects){
1375+
if(
1376+
__DEV__&&
1377+
enableDoubleInvokingEffects&&
1378+
(currentlyRenderingFiber.mode&(BlockingMode|ConcurrentMode))!==NoMode
1379+
){
13591380
returnmountEffectImpl(
13601381
MountLayoutDevEffect|UpdateEffect,
13611382
HookLayout,

‎packages/react-reconciler/src/ReactFiberWorkLoop.new.js

+7
Original file line numberDiff line numberDiff line change
@@ -2874,6 +2874,11 @@ function commitDoubleInvokeEffectsInDEV(
28742874
hasPassiveEffects: boolean,
28752875
){
28762876
if(__DEV__&&enableDoubleInvokingEffects){
2877+
// Never double-invoke effects for legacy roots.
2878+
if((fiber.mode&(BlockingMode|ConcurrentMode))===NoMode){
2879+
return;
2880+
}
2881+
28772882
setCurrentDebugFiberInDEV(fiber);
28782883
invokeEffectsInDev(fiber,MountLayoutDev,invokeLayoutEffectUnmountInDEV);
28792884
if(hasPassiveEffects){
@@ -2898,6 +2903,8 @@ function invokeEffectsInDev(
28982903
invokeEffectFn: (fiber: Fiber)=>void,
28992904
): void{
29002905
if(__DEV__&&enableDoubleInvokingEffects){
2906+
// We don't need to re-check for legacy roots here.
2907+
// This function will not be called within legacy roots.
29012908
letfiber=firstChild;
29022909
while(fiber!==null){
29032910
if(fiber.child!==null){

0 commit comments

Comments
 (0)
close