From 2e25ee373d96a882cee9a1ee3d7fee3f498bde2d Mon Sep 17 00:00:00 2001 From: Ricky Date: Sat, 14 Dec 2024 11:11:04 -0500 Subject: [PATCH] [flags] Cleanup enableUseMemoCacheHook (#31767) Based off https://github.com/facebook/react/pull/31766 This has already landed everywhere. --- .../ReactHooksInspectionIntegration-test.js | 2 - .../react-reconciler/src/ReactFiberHooks.js | 107 ++++++------------ .../src/__tests__/useMemoCache-test.js | 7 -- packages/react-server/src/ReactFizzHooks.js | 5 +- packages/shared/ReactFeatureFlags.js | 3 - .../forks/ReactFeatureFlags.native-fb.js | 1 - .../forks/ReactFeatureFlags.native-oss.js | 1 - .../forks/ReactFeatureFlags.test-renderer.js | 1 - ...actFeatureFlags.test-renderer.native-fb.js | 1 - .../ReactFeatureFlags.test-renderer.www.js | 1 - .../shared/forks/ReactFeatureFlags.www.js | 1 - 11 files changed, 33 insertions(+), 97 deletions(-) diff --git a/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js b/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js index fcd84fedfed71..ff8e7e1ac8683 100644 --- a/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js +++ b/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js @@ -1573,7 +1573,6 @@ describe('ReactHooksInspectionIntegration', () => { }); describe('useMemoCache', () => { - // @gate enableUseMemoCacheHook it('should not be inspectable', async () => { function Foo() { const $ = useMemoCache(1); @@ -1601,7 +1600,6 @@ describe('ReactHooksInspectionIntegration', () => { expect(tree.length).toEqual(0); }); - // @gate enableUseMemoCacheHook it('should work in combination with other hooks', async () => { function useSomething() { const [something] = React.useState(null); diff --git a/packages/react-reconciler/src/ReactFiberHooks.js b/packages/react-reconciler/src/ReactFiberHooks.js index 033e71610f5c6..d2df61063f687 100644 --- a/packages/react-reconciler/src/ReactFiberHooks.js +++ b/packages/react-reconciler/src/ReactFiberHooks.js @@ -40,7 +40,6 @@ import { enableCache, enableLazyContextPropagation, enableTransitionTracing, - enableUseMemoCacheHook, enableUseEffectEventHook, enableLegacyCache, debugRenderPhaseSideEffectsForStrictMode, @@ -277,8 +276,7 @@ export type FunctionComponentUpdateQueue = { lastEffect: Effect | null, events: Array> | null, stores: Array> | null, - // NOTE: optional, only set when enableUseMemoCacheHook is enabled - memoCache?: MemoCache | null, + memoCache: MemoCache | null, }; type BasicStateAction = (S => S) | S; @@ -1127,25 +1125,12 @@ function unstable_useContextWithBailout( return readContextAndCompare(context, select); } -// NOTE: defining two versions of this function to avoid size impact when this feature is disabled. -// Previously this function was inlined, the additional `memoCache` property makes it not inlined. -let createFunctionComponentUpdateQueue: () => FunctionComponentUpdateQueue; -if (enableUseMemoCacheHook) { - createFunctionComponentUpdateQueue = () => { - return { - lastEffect: null, - events: null, - stores: null, - memoCache: null, - }; - }; -} else { - createFunctionComponentUpdateQueue = () => { - return { - lastEffect: null, - events: null, - stores: null, - }; +function createFunctionComponentUpdateQueue(): FunctionComponentUpdateQueue { + return { + lastEffect: null, + events: null, + stores: null, + memoCache: null, }; } @@ -1155,13 +1140,11 @@ function resetFunctionComponentUpdateQueue( updateQueue.lastEffect = null; updateQueue.events = null; updateQueue.stores = null; - if (enableUseMemoCacheHook) { - if (updateQueue.memoCache != null) { - // NOTE: this function intentionally does not reset memoCache data. We reuse updateQueue for the memo - // cache to avoid increasing the size of fibers that don't need a cache, but we don't want to reset - // the cache when other properties are reset. - updateQueue.memoCache.index = 0; - } + if (updateQueue.memoCache != null) { + // NOTE: this function intentionally does not reset memoCache data. We reuse updateQueue for the memo + // cache to avoid increasing the size of fibers that don't need a cache, but we don't want to reset + // the cache when other properties are reset. + updateQueue.memoCache.index = 0; } } @@ -3982,13 +3965,11 @@ export const ContextOnlyDispatcher: Dispatcher = { useFormState: throwInvalidHookError, useActionState: throwInvalidHookError, useOptimistic: throwInvalidHookError, + useMemoCache: throwInvalidHookError, }; if (enableCache) { (ContextOnlyDispatcher: Dispatcher).useCacheRefresh = throwInvalidHookError; } -if (enableUseMemoCacheHook) { - (ContextOnlyDispatcher: Dispatcher).useMemoCache = throwInvalidHookError; -} if (enableUseEffectEventHook) { (ContextOnlyDispatcher: Dispatcher).useEffectEvent = throwInvalidHookError; } @@ -4023,13 +4004,11 @@ const HooksDispatcherOnMount: Dispatcher = { useFormState: mountActionState, useActionState: mountActionState, useOptimistic: mountOptimistic, + useMemoCache, }; if (enableCache) { (HooksDispatcherOnMount: Dispatcher).useCacheRefresh = mountRefresh; } -if (enableUseMemoCacheHook) { - (HooksDispatcherOnMount: Dispatcher).useMemoCache = useMemoCache; -} if (enableUseEffectEventHook) { (HooksDispatcherOnMount: Dispatcher).useEffectEvent = mountEvent; } @@ -4064,13 +4043,11 @@ const HooksDispatcherOnUpdate: Dispatcher = { useFormState: updateActionState, useActionState: updateActionState, useOptimistic: updateOptimistic, + useMemoCache, }; if (enableCache) { (HooksDispatcherOnUpdate: Dispatcher).useCacheRefresh = updateRefresh; } -if (enableUseMemoCacheHook) { - (HooksDispatcherOnUpdate: Dispatcher).useMemoCache = useMemoCache; -} if (enableUseEffectEventHook) { (HooksDispatcherOnUpdate: Dispatcher).useEffectEvent = updateEvent; } @@ -4106,13 +4083,11 @@ const HooksDispatcherOnRerender: Dispatcher = { useFormState: rerenderActionState, useActionState: rerenderActionState, useOptimistic: rerenderOptimistic, + useMemoCache, }; if (enableCache) { (HooksDispatcherOnRerender: Dispatcher).useCacheRefresh = updateRefresh; } -if (enableUseMemoCacheHook) { - (HooksDispatcherOnRerender: Dispatcher).useMemoCache = useMemoCache; -} if (enableUseEffectEventHook) { (HooksDispatcherOnRerender: Dispatcher).useEffectEvent = updateEvent; } @@ -4307,6 +4282,7 @@ if (__DEV__) { return mountOptimistic(passthrough, reducer); }, useHostTransitionStatus, + useMemoCache, }; if (enableCache) { (HooksDispatcherOnMountInDEV: Dispatcher).useCacheRefresh = @@ -4316,9 +4292,6 @@ if (__DEV__) { return mountRefresh(); }; } - if (enableUseMemoCacheHook) { - (HooksDispatcherOnMountInDEV: Dispatcher).useMemoCache = useMemoCache; - } if (enableUseEffectEventHook) { (HooksDispatcherOnMountInDEV: Dispatcher).useEffectEvent = function useEffectEvent) => Return>( @@ -4511,6 +4484,7 @@ if (__DEV__) { return mountOptimistic(passthrough, reducer); }, useHostTransitionStatus, + useMemoCache, }; if (enableCache) { (HooksDispatcherOnMountWithHookTypesInDEV: Dispatcher).useCacheRefresh = @@ -4520,10 +4494,6 @@ if (__DEV__) { return mountRefresh(); }; } - if (enableUseMemoCacheHook) { - (HooksDispatcherOnMountWithHookTypesInDEV: Dispatcher).useMemoCache = - useMemoCache; - } if (enableUseEffectEventHook) { (HooksDispatcherOnMountWithHookTypesInDEV: Dispatcher).useEffectEvent = function useEffectEvent) => Return>( @@ -4715,6 +4685,7 @@ if (__DEV__) { return updateOptimistic(passthrough, reducer); }, useHostTransitionStatus, + useMemoCache, }; if (enableCache) { (HooksDispatcherOnUpdateInDEV: Dispatcher).useCacheRefresh = @@ -4724,9 +4695,6 @@ if (__DEV__) { return updateRefresh(); }; } - if (enableUseMemoCacheHook) { - (HooksDispatcherOnUpdateInDEV: Dispatcher).useMemoCache = useMemoCache; - } if (enableUseEffectEventHook) { (HooksDispatcherOnUpdateInDEV: Dispatcher).useEffectEvent = function useEffectEvent) => Return>( @@ -4918,6 +4886,7 @@ if (__DEV__) { return rerenderOptimistic(passthrough, reducer); }, useHostTransitionStatus, + useMemoCache, }; if (enableCache) { (HooksDispatcherOnRerenderInDEV: Dispatcher).useCacheRefresh = @@ -4927,9 +4896,6 @@ if (__DEV__) { return updateRefresh(); }; } - if (enableUseMemoCacheHook) { - (HooksDispatcherOnRerenderInDEV: Dispatcher).useMemoCache = useMemoCache; - } if (enableUseEffectEventHook) { (HooksDispatcherOnRerenderInDEV: Dispatcher).useEffectEvent = function useEffectEvent) => Return>( @@ -5141,6 +5107,10 @@ if (__DEV__) { mountHookTypesDev(); return mountOptimistic(passthrough, reducer); }, + useMemoCache(size: number): Array { + warnInvalidHookAccess(); + return useMemoCache(size); + }, useHostTransitionStatus, }; if (enableCache) { @@ -5151,13 +5121,6 @@ if (__DEV__) { return mountRefresh(); }; } - if (enableUseMemoCacheHook) { - (InvalidNestedHooksDispatcherOnMountInDEV: Dispatcher).useMemoCache = - function (size: number): Array { - warnInvalidHookAccess(); - return useMemoCache(size); - }; - } if (enableUseEffectEventHook) { (InvalidNestedHooksDispatcherOnMountInDEV: Dispatcher).useEffectEvent = function useEffectEvent) => Return>( @@ -5372,6 +5335,10 @@ if (__DEV__) { updateHookTypesDev(); return updateOptimistic(passthrough, reducer); }, + useMemoCache(size: number): Array { + warnInvalidHookAccess(); + return useMemoCache(size); + }, useHostTransitionStatus, }; if (enableCache) { @@ -5382,13 +5349,6 @@ if (__DEV__) { return updateRefresh(); }; } - if (enableUseMemoCacheHook) { - (InvalidNestedHooksDispatcherOnUpdateInDEV: Dispatcher).useMemoCache = - function (size: number): Array { - warnInvalidHookAccess(); - return useMemoCache(size); - }; - } if (enableUseEffectEventHook) { (InvalidNestedHooksDispatcherOnUpdateInDEV: Dispatcher).useEffectEvent = function useEffectEvent) => Return>( @@ -5603,6 +5563,10 @@ if (__DEV__) { updateHookTypesDev(); return rerenderOptimistic(passthrough, reducer); }, + useMemoCache(size: number): Array { + warnInvalidHookAccess(); + return useMemoCache(size); + }, useHostTransitionStatus, }; if (enableCache) { @@ -5613,13 +5577,6 @@ if (__DEV__) { return updateRefresh(); }; } - if (enableUseMemoCacheHook) { - (InvalidNestedHooksDispatcherOnRerenderInDEV: Dispatcher).useMemoCache = - function (size: number): Array { - warnInvalidHookAccess(); - return useMemoCache(size); - }; - } if (enableUseEffectEventHook) { (InvalidNestedHooksDispatcherOnRerenderInDEV: Dispatcher).useEffectEvent = function useEffectEvent) => Return>( diff --git a/packages/react-reconciler/src/__tests__/useMemoCache-test.js b/packages/react-reconciler/src/__tests__/useMemoCache-test.js index 520cd7cb72463..c07d3a6d9960c 100644 --- a/packages/react-reconciler/src/__tests__/useMemoCache-test.js +++ b/packages/react-reconciler/src/__tests__/useMemoCache-test.js @@ -58,7 +58,6 @@ describe('useMemoCache()', () => { ErrorBoundary = _ErrorBoundary; }); - // @gate enableUseMemoCacheHook it('render component using cache', async () => { function Component(props) { const cache = useMemoCache(1); @@ -75,7 +74,6 @@ describe('useMemoCache()', () => { expect(root).toMatchRenderedOutput('Ok'); }); - // @gate enableUseMemoCacheHook it('update component using cache', async () => { let setX; let forceUpdate; @@ -145,7 +143,6 @@ describe('useMemoCache()', () => { expect(data).toBe(data1); // confirm that the cache persisted across renders }); - // @gate enableUseMemoCacheHook it('update component using cache with setstate during render', async () => { let setN; function Component(props) { @@ -210,7 +207,6 @@ describe('useMemoCache()', () => { expect(data).toBe(data0); }); - // @gate enableUseMemoCacheHook it('update component using cache with throw during render', async () => { let setN; let shouldFail = true; @@ -293,7 +289,6 @@ describe('useMemoCache()', () => { expect(data).toBe(data1); // confirm that the cache persisted across renders }); - // @gate enableUseMemoCacheHook it('update component and custom hook with caches', async () => { let setX; let forceUpdate; @@ -370,7 +365,6 @@ describe('useMemoCache()', () => { expect(data).toBe(data1); // confirm that the cache persisted across renders }); - // @gate enableUseMemoCacheHook it('reuses computations from suspended/interrupted render attempts during an update', async () => { // This test demonstrates the benefit of a shared memo cache. By "shared" I // mean multiple concurrent render attempts of the same component/hook use @@ -624,7 +618,6 @@ describe('useMemoCache()', () => { ); }); - // @gate enableUseMemoCacheHook it('(repro) infinite renders when used with setState during render', async () => { // Output of react compiler on `useUserMemo` function useCompilerMemo(value) { diff --git a/packages/react-server/src/ReactFizzHooks.js b/packages/react-server/src/ReactFizzHooks.js index e4e81af8fabb8..a163aa11516b7 100644 --- a/packages/react-server/src/ReactFizzHooks.js +++ b/packages/react-server/src/ReactFizzHooks.js @@ -41,7 +41,6 @@ import {createFastHash} from './ReactServerStreamConfig'; import { enableCache, enableUseEffectEventHook, - enableUseMemoCacheHook, enableUseResourceEffectHook, } from 'shared/ReactFeatureFlags'; import is from 'shared/objectIs'; @@ -859,6 +858,7 @@ export const HooksDispatcher: Dispatcher = supportsClientAPIs useActionState, useFormState: useActionState, useHostTransitionStatus, + useMemoCache, }; if (enableCache) { @@ -867,9 +867,6 @@ if (enableCache) { if (enableUseEffectEventHook) { HooksDispatcher.useEffectEvent = useEffectEvent; } -if (enableUseMemoCacheHook) { - HooksDispatcher.useMemoCache = useMemoCache; -} if (enableUseResourceEffectHook) { HooksDispatcher.useResourceEffect = supportsClientAPIs ? noop diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index 8ac0fd86e28ed..212afaabc4216 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -115,9 +115,6 @@ export const enableCPUSuspense = __EXPERIMENTAL__; export const enableHydrationLaneScheduling = true; -// Enables useMemoCache hook, intended as a compilation target for -// auto-memoization. -export const enableUseMemoCacheHook = true; // Test this at Meta before enabling. export const enableNoCloningMemoCache = false; diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index 1948a38163cca..7493a34494d82 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -80,7 +80,6 @@ export const enableTransitionTracing = false; export const enableTrustedTypesIntegration = false; export const enableUpdaterTracking = __PROFILE__; export const enableUseEffectEventHook = false; -export const enableUseMemoCacheHook = true; export const favorSafetyOverHydrationPerf = true; export const renameElementSymbol = false; export const retryLaneExpirationMs = 5000; diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index 12d1598e6a16e..e034a723d7574 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -69,7 +69,6 @@ export const enableTaint = true; export const enableTransitionTracing = false; export const enableTrustedTypesIntegration = false; export const enableUseEffectEventHook = false; -export const enableUseMemoCacheHook = true; export const favorSafetyOverHydrationPerf = true; export const passChildrenWhenCloningPersistedNodes = false; export const renameElementSymbol = true; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index 609c5628063b9..fe518f955e949 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -35,7 +35,6 @@ export const disableTextareaChildren = false; export const enableSuspenseAvoidThisFallback = false; export const enableSuspenseAvoidThisFallbackFizz = false; export const enableCPUSuspense = false; -export const enableUseMemoCacheHook = true; export const enableNoCloningMemoCache = false; export const enableUseEffectEventHook = false; export const favorSafetyOverHydrationPerf = true; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js index 169c5c9e2878b..0b0da8b8cb326 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js @@ -64,7 +64,6 @@ export const enableTransitionTracing = false; export const enableTrustedTypesIntegration = false; export const enableUpdaterTracking = false; export const enableUseEffectEventHook = false; -export const enableUseMemoCacheHook = true; export const favorSafetyOverHydrationPerf = true; export const passChildrenWhenCloningPersistedNodes = false; export const renameElementSymbol = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js index 6ecd34dfbd1bd..63f76b4a3a7c4 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js @@ -37,7 +37,6 @@ export const disableTextareaChildren = false; export const enableSuspenseAvoidThisFallback = true; export const enableSuspenseAvoidThisFallbackFizz = false; export const enableCPUSuspense = false; -export const enableUseMemoCacheHook = true; export const enableNoCloningMemoCache = false; export const enableUseEffectEventHook = false; export const favorSafetyOverHydrationPerf = true; diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index be91e1c8e4ecd..f54c73a4647d4 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -54,7 +54,6 @@ export const enableSuspenseAvoidThisFallback = true; export const enableSuspenseAvoidThisFallbackFizz = false; export const enableCPUSuspense = true; -export const enableUseMemoCacheHook = true; export const enableUseEffectEventHook = true; export const enableMoveBefore = false; export const disableInputAttributeSyncing = false;