From 0aab065eb3250a9714a62dc05587cbb571da7f71 Mon Sep 17 00:00:00 2001 From: Timothy Yung Date: Mon, 18 Mar 2024 11:16:47 -0700 Subject: [PATCH] Add `alwaysThrottleDisappearingFallbacks` Flag (#28550) ## Summary Creates a new `alwaysThrottleDisappearingFallbacks` feature flag that gates the changes from https://github.com/facebook/react/pull/26802 (instead of being controlled by `alwaysThrottleRetries`). The values of this new flag mirror the current values of `alwaysThrottleRetries` such that there is no behavior difference. This additional feature flag allows us to incrementally validate the change (arguably bug fix) from https://github.com/facebook/react/pull/26802 independently from `alwaysThrottleRetries`. ## How did you test this change? ``` $ yarn test $ yarn flow dom-browser $ yarn flow dom-fb $ yarn flow fabric ``` --- packages/react-reconciler/src/ReactFiberCommitWork.js | 4 ++-- packages/shared/ReactFeatureFlags.js | 2 ++ packages/shared/forks/ReactFeatureFlags.native-fb-dynamic.js | 1 + packages/shared/forks/ReactFeatureFlags.native-fb.js | 1 + packages/shared/forks/ReactFeatureFlags.native-oss.js | 1 + packages/shared/forks/ReactFeatureFlags.test-renderer.js | 1 + .../shared/forks/ReactFeatureFlags.test-renderer.native.js | 1 + packages/shared/forks/ReactFeatureFlags.test-renderer.www.js | 1 + packages/shared/forks/ReactFeatureFlags.www-dynamic.js | 1 + packages/shared/forks/ReactFeatureFlags.www.js | 1 + scripts/flow/xplat.js | 1 + 11 files changed, 13 insertions(+), 2 deletions(-) diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.js b/packages/react-reconciler/src/ReactFiberCommitWork.js index fdd289d93280f..65b8c713c4eee 100644 --- a/packages/react-reconciler/src/ReactFiberCommitWork.js +++ b/packages/react-reconciler/src/ReactFiberCommitWork.js @@ -40,6 +40,7 @@ import type { } from './ReactFiberTracingMarkerComponent'; import { + alwaysThrottleDisappearingFallbacks, enableCreateEventHandleAPI, enableProfilerTimer, enableProfilerCommitHooks, @@ -53,7 +54,6 @@ import { enableUseEffectEventHook, enableFloat, enableLegacyHidden, - alwaysThrottleRetries, disableStringRefs, } from 'shared/ReactFeatureFlags'; import { @@ -2896,7 +2896,7 @@ function commitMutationEffectsOnFiber( current !== null && (current.memoizedState: SuspenseState | null) !== null; - if (alwaysThrottleRetries) { + if (alwaysThrottleDisappearingFallbacks) { if (isShowingFallback !== wasShowingFallback) { // A fallback is either appearing or disappearing. markCommitTimeOfFallback(); diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index ff03d8849afe2..c320acdc45cb4 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -113,6 +113,8 @@ export const enableUseEffectEventHook = __EXPERIMENTAL__; // (handled with an MutationObserver) instead of inline-scripts export const enableFizzExternalRuntime = true; +export const alwaysThrottleDisappearingFallbacks = true; + export const alwaysThrottleRetries = true; export const passChildrenWhenCloningPersistedNodes = false; diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb-dynamic.js b/packages/shared/forks/ReactFeatureFlags.native-fb-dynamic.js index de68e6dcccdbb..38943de13d524 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb-dynamic.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb-dynamic.js @@ -20,6 +20,7 @@ import typeof * as DynamicFlagsType from 'ReactNativeInternalFeatureFlags'; // flag here but it won't be set to `true` in any of our test runs. Need to // update the test configuration. +export const alwaysThrottleDisappearingFallbacks = __VARIANT__; export const alwaysThrottleRetries = __VARIANT__; export const consoleManagedByDevToolsDuringStrictMode = __VARIANT__; export const enableAsyncActions = __VARIANT__; diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index 93a8d66ce7da3..64753fba3f96f 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -18,6 +18,7 @@ import * as dynamicFlags from 'ReactNativeInternalFeatureFlags'; // We destructure each value before re-exporting to avoid a dynamic look-up on // the exports object every time a flag is read. export const { + alwaysThrottleDisappearingFallbacks, alwaysThrottleRetries, consoleManagedByDevToolsDuringStrictMode, enableAsyncActions, diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index 60581ea148ab0..4dd502dc0d46b 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -86,6 +86,7 @@ export const enableInfiniteRenderLoopDetection = false; export const enableAsyncActions = false; +export const alwaysThrottleDisappearingFallbacks = false; export const alwaysThrottleRetries = false; export const passChildrenWhenCloningPersistedNodes = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index 366e475a4f57a..b1dd230c472f5 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -76,6 +76,7 @@ export const enableDeferRootSchedulingToMicrotask = true; export const enableAsyncActions = true; +export const alwaysThrottleDisappearingFallbacks = true; export const alwaysThrottleRetries = true; export const passChildrenWhenCloningPersistedNodes = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js index fd9531385971b..e5a6bf7ec0b3e 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js @@ -77,6 +77,7 @@ export const enableDeferRootSchedulingToMicrotask = false; export const enableAsyncActions = true; +export const alwaysThrottleDisappearingFallbacks = true; export const alwaysThrottleRetries = true; export const passChildrenWhenCloningPersistedNodes = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js index f6b6be8054609..21740962d076e 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js @@ -78,6 +78,7 @@ export const enableDeferRootSchedulingToMicrotask = true; export const enableAsyncActions = true; +export const alwaysThrottleDisappearingFallbacks = false; export const alwaysThrottleRetries = true; export const passChildrenWhenCloningPersistedNodes = false; diff --git a/packages/shared/forks/ReactFeatureFlags.www-dynamic.js b/packages/shared/forks/ReactFeatureFlags.www-dynamic.js index 40e4e943aa9b1..f8ebfb050fc67 100644 --- a/packages/shared/forks/ReactFeatureFlags.www-dynamic.js +++ b/packages/shared/forks/ReactFeatureFlags.www-dynamic.js @@ -23,6 +23,7 @@ export const forceConcurrentByDefaultForTesting = __VARIANT__; export const enableUnifiedSyncLane = __VARIANT__; export const enableTransitionTracing = __VARIANT__; export const enableDeferRootSchedulingToMicrotask = __VARIANT__; +export const alwaysThrottleDisappearingFallbacks = __VARIANT__; export const alwaysThrottleRetries = __VARIANT__; export const enableDO_NOT_USE_disableStrictPassiveEffect = __VARIANT__; export const enableUseDeferredValueInitialArg = __VARIANT__; diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index fd8118d51a965..ed502266d112b 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -26,6 +26,7 @@ export const { enableRetryLaneExpiration, enableTransitionTracing, enableDeferRootSchedulingToMicrotask, + alwaysThrottleDisappearingFallbacks, alwaysThrottleRetries, enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop, diff --git a/scripts/flow/xplat.js b/scripts/flow/xplat.js index 9b9a065de410f..9c458c2c8ef8c 100644 --- a/scripts/flow/xplat.js +++ b/scripts/flow/xplat.js @@ -8,6 +8,7 @@ */ declare module 'ReactNativeInternalFeatureFlags' { + declare export var alwaysThrottleDisappearingFallbacks: boolean; declare export var alwaysThrottleRetries: boolean; declare export var consoleManagedByDevToolsDuringStrictMode: boolean; declare export var enableAsyncActions: boolean;