From 443a9a3c26d0525e7f75165bdc0986d37bf70568 Mon Sep 17 00:00:00 2001 From: Lauren Tan Date: Mon, 7 Oct 2024 15:18:11 -0400 Subject: [PATCH 1/3] Update [ghstack-poisoned] --- packages/react/index.development.js | 1 + packages/react/index.experimental.development.js | 1 + packages/react/index.experimental.js | 1 + packages/react/index.fb.js | 1 + packages/react/index.js | 1 + packages/react/src/ReactClient.js | 2 ++ packages/react/src/ReactCompilerRuntime.js | 14 ++++++++++++++ 7 files changed, 21 insertions(+) create mode 100644 packages/react/src/ReactCompilerRuntime.js diff --git a/packages/react/index.development.js b/packages/react/index.development.js index c94c460b97416..bf08db7a58418 100644 --- a/packages/react/index.development.js +++ b/packages/react/index.development.js @@ -30,6 +30,7 @@ export type ChildrenArray<+T> = $ReadOnlyArray> | T; // We can't use export * from in Flow for some reason. export { __CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, + __COMPILER_RUNTIME, Children, Component, Fragment, diff --git a/packages/react/index.experimental.development.js b/packages/react/index.experimental.development.js index 4ffcdea0d242e..676b9eea4d9a9 100644 --- a/packages/react/index.experimental.development.js +++ b/packages/react/index.experimental.development.js @@ -9,6 +9,7 @@ export { __CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, + __COMPILER_RUNTIME, Children, Component, Fragment, diff --git a/packages/react/index.experimental.js b/packages/react/index.experimental.js index 6f2ab835135c0..ae98e3b91f19c 100644 --- a/packages/react/index.experimental.js +++ b/packages/react/index.experimental.js @@ -9,6 +9,7 @@ export { __CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, + __COMPILER_RUNTIME, Children, Component, Fragment, diff --git a/packages/react/index.fb.js b/packages/react/index.fb.js index 1b87e4b2e582f..7999655f30e4b 100644 --- a/packages/react/index.fb.js +++ b/packages/react/index.fb.js @@ -9,6 +9,7 @@ export { __CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, + __COMPILER_RUNTIME, act, cache, Children, diff --git a/packages/react/index.js b/packages/react/index.js index 19f256fd73b5b..0c048c4e9c297 100644 --- a/packages/react/index.js +++ b/packages/react/index.js @@ -31,6 +31,7 @@ export type ChildrenArray<+T> = $ReadOnlyArray> | T; // We can't use export * from in Flow for some reason. export { __CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, + __COMPILER_RUNTIME, Children, Component, Fragment, diff --git a/packages/react/src/ReactClient.js b/packages/react/src/ReactClient.js index 318d8e648d9d5..ed064fe8031c0 100644 --- a/packages/react/src/ReactClient.js +++ b/packages/react/src/ReactClient.js @@ -63,6 +63,7 @@ import ReactSharedInternals from './ReactSharedInternalsClient'; import {startTransition} from './ReactStartTransition'; import {act} from './ReactAct'; import {captureOwnerStack} from './ReactOwnerStack'; +import ReactCompilerRuntime from './ReactCompilerRuntime'; const Children = { map, @@ -109,6 +110,7 @@ export { isValidElement, ReactVersion as version, ReactSharedInternals as __CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, + ReactCompilerRuntime as __COMPILER_RUNTIME, // Concurrent Mode useTransition, startTransition, diff --git a/packages/react/src/ReactCompilerRuntime.js b/packages/react/src/ReactCompilerRuntime.js new file mode 100644 index 0000000000000..a19d05596863e --- /dev/null +++ b/packages/react/src/ReactCompilerRuntime.js @@ -0,0 +1,14 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +import {useMemoCache} from './ReactHooks'; + +export default { + c: useMemoCache, +}; From 0f22b5b2315a3e1e5a0f28b287b303db77b9f5a1 Mon Sep 17 00:00:00 2001 From: Lauren Tan Date: Mon, 7 Oct 2024 15:18:15 -0400 Subject: [PATCH 2/3] Update [ghstack-poisoned] --- .../react-compiler-runtime/src/index.ts | 37 +++++++++++-------- 1 file changed, 21 insertions(+), 16 deletions(-) diff --git a/compiler/packages/react-compiler-runtime/src/index.ts b/compiler/packages/react-compiler-runtime/src/index.ts index 823a49ab8199f..7b8cbe36f52db 100644 --- a/compiler/packages/react-compiler-runtime/src/index.ts +++ b/compiler/packages/react-compiler-runtime/src/index.ts @@ -19,22 +19,27 @@ const ReactSecretInternals = type MemoCache = Array; const $empty = Symbol.for('react.memo_cache_sentinel'); -/** - * DANGER: this hook is NEVER meant to be called directly! - **/ -export function c(size: number) { - return React.useState(() => { - const $ = new Array(size); - for (let ii = 0; ii < size; ii++) { - $[ii] = $empty; - } - // This symbol is added to tell the react devtools that this array is from - // useMemoCache. - // @ts-ignore - $[$empty] = true; - return $; - })[0]; -} + +// Re-export React.c if present, otherwise fallback to the userspace polyfill for versions of React +// < 19. +export const c = + // @ts-expect-error + typeof React.__COMPILER_RUNTIME?.c === 'function' + ? // @ts-expect-error + React.__COMPILER_RUNTIME.c + : function c(size: number) { + return React.useMemo>(() => { + const $ = new Array(size); + for (let ii = 0; ii < size; ii++) { + $[ii] = $empty; + } + // This symbol is added to tell the react devtools that this array is from + // useMemoCache. + // @ts-ignore + $[$empty] = true; + return $; + }, []); + }; const LazyGuardDispatcher: {[key: string]: (...args: Array) => any} = {}; [ From 491db33c9713c3eb8e4ba74090b4665b9932000b Mon Sep 17 00:00:00 2001 From: Lauren Tan Date: Mon, 7 Oct 2024 15:18:18 -0400 Subject: [PATCH 3/3] Update [ghstack-poisoned] --- .../fixtures/compiler/module-scoped-bindings.expect.md | 2 +- compiler/packages/snap/src/sprout/evaluator.ts | 5 ----- 2 files changed, 1 insertion(+), 6 deletions(-) diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/module-scoped-bindings.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/module-scoped-bindings.expect.md index 36eeaabc7b8b6..5c870b43aff1c 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/module-scoped-bindings.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/module-scoped-bindings.expect.md @@ -101,4 +101,4 @@ export const FIXTURE_ENTRYPOINT = { ``` ### Eval output -(kind: ok) [{"Children":{"map":"[[ function params=3 ]]","forEach":"[[ function params=3 ]]","count":"[[ function params=1 ]]","toArray":"[[ function params=1 ]]","only":"[[ function params=1 ]]"},"Component":"[[ function params=3 ]]","PureComponent":"[[ function params=3 ]]","__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE":{"H":{"readContext":"[[ function params=1 ]]","use":"[[ function params=1 ]]","useCallback":"[[ function params=2 ]]","useContext":"[[ function params=1 ]]","useEffect":"[[ function params=2 ]]","useImperativeHandle":"[[ function params=3 ]]","useInsertionEffect":"[[ function params=2 ]]","useLayoutEffect":"[[ function params=2 ]]","useMemo":"[[ function params=2 ]]","useReducer":"[[ function params=3 ]]","useRef":"[[ function params=1 ]]","useState":"[[ function params=1 ]]","useDebugValue":"[[ function params=2 ]]","useDeferredValue":"[[ function params=2 ]]","useTransition":"[[ function params=0 ]]","useSyncExternalStore":"[[ function params=3 ]]","useId":"[[ function params=0 ]]","useCacheRefresh":"[[ function params=0 ]]","useMemoCache":"[[ function params=1 ]]","useHostTransitionStatus":"[[ function params=0 ]]","useFormState":"[[ function params=3 ]]","useActionState":"[[ function params=3 ]]","useOptimistic":"[[ function params=2 ]]"},"A":{"getCacheForType":"[[ function params=1 ]]","getOwner":"[[ function params=0 ]]"},"T":null,"actQueue":["[[ function params=0 ]]","[[ function params=1 ]]"],"isBatchingLegacy":false,"didScheduleLegacyUpdate":false,"didUsePromise":false,"thrownErrors":[],"setExtraStackFrame":"[[ function params=1 ]]","getCurrentStack":"[[ function params=0 ]]","getStackAddendum":"[[ function params=0 ]]"},"act":"[[ function params=1 ]]","cache":"[[ function params=1 ]]","cloneElement":"[[ function params=3 ]]","createContext":"[[ function params=1 ]]","createElement":"[[ function params=3 ]]","createRef":"[[ function params=0 ]]","forwardRef":"[[ function params=1 ]]","isValidElement":"[[ function params=1 ]]","lazy":"[[ function params=1 ]]","memo":"[[ function params=2 ]]","startTransition":"[[ function params=2 ]]","unstable_useCacheRefresh":"[[ function params=0 ]]","use":"[[ function params=1 ]]","useActionState":"[[ function params=3 ]]","useCallback":"[[ function params=2 ]]","useContext":"[[ function params=1 ]]","useDebugValue":"[[ function params=2 ]]","useDeferredValue":"[[ function params=2 ]]","useEffect":"[[ function params=2 ]]","useId":"[[ function params=0 ]]","useImperativeHandle":"[[ function params=3 ]]","useInsertionEffect":"[[ function params=2 ]]","useLayoutEffect":"[[ function params=2 ]]","useMemo":"[[ function params=2 ]]","useOptimistic":"[[ function params=2 ]]","useReducer":"[[ function params=3 ]]","useRef":"[[ function params=1 ]]","useState":"[[ function params=1 ]]","useSyncExternalStore":"[[ function params=3 ]]","useTransition":"[[ function params=0 ]]","version":"19.0.0-beta-b498834eab-20240506","c":"[[ function params=1 ]]"},"[[ cyclic ref *6 ]]",true,true,true,true,"[[ function params=0 ]]",true,"[[ function params=0 ]]"] \ No newline at end of file +(kind: ok) [{"Children":{"map":"[[ function params=3 ]]","forEach":"[[ function params=3 ]]","count":"[[ function params=1 ]]","toArray":"[[ function params=1 ]]","only":"[[ function params=1 ]]"},"Component":"[[ function params=3 ]]","PureComponent":"[[ function params=3 ]]","__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE":{"H":{"readContext":"[[ function params=1 ]]","use":"[[ function params=1 ]]","useCallback":"[[ function params=2 ]]","useContext":"[[ function params=1 ]]","useEffect":"[[ function params=2 ]]","useImperativeHandle":"[[ function params=3 ]]","useInsertionEffect":"[[ function params=2 ]]","useLayoutEffect":"[[ function params=2 ]]","useMemo":"[[ function params=2 ]]","useReducer":"[[ function params=3 ]]","useRef":"[[ function params=1 ]]","useState":"[[ function params=1 ]]","useDebugValue":"[[ function params=2 ]]","useDeferredValue":"[[ function params=2 ]]","useTransition":"[[ function params=0 ]]","useSyncExternalStore":"[[ function params=3 ]]","useId":"[[ function params=0 ]]","useCacheRefresh":"[[ function params=0 ]]","useMemoCache":"[[ function params=1 ]]","useHostTransitionStatus":"[[ function params=0 ]]","useFormState":"[[ function params=3 ]]","useActionState":"[[ function params=3 ]]","useOptimistic":"[[ function params=2 ]]"},"A":{"getCacheForType":"[[ function params=1 ]]","getOwner":"[[ function params=0 ]]"},"T":null,"actQueue":["[[ function params=0 ]]","[[ function params=1 ]]"],"isBatchingLegacy":false,"didScheduleLegacyUpdate":false,"didUsePromise":false,"thrownErrors":[],"setExtraStackFrame":"[[ function params=1 ]]","getCurrentStack":"[[ function params=0 ]]","getStackAddendum":"[[ function params=0 ]]"},"act":"[[ function params=1 ]]","cache":"[[ function params=1 ]]","cloneElement":"[[ function params=3 ]]","createContext":"[[ function params=1 ]]","createElement":"[[ function params=3 ]]","createRef":"[[ function params=0 ]]","forwardRef":"[[ function params=1 ]]","isValidElement":"[[ function params=1 ]]","lazy":"[[ function params=1 ]]","memo":"[[ function params=2 ]]","startTransition":"[[ function params=2 ]]","unstable_useCacheRefresh":"[[ function params=0 ]]","use":"[[ function params=1 ]]","useActionState":"[[ function params=3 ]]","useCallback":"[[ function params=2 ]]","useContext":"[[ function params=1 ]]","useDebugValue":"[[ function params=2 ]]","useDeferredValue":"[[ function params=2 ]]","useEffect":"[[ function params=2 ]]","useId":"[[ function params=0 ]]","useImperativeHandle":"[[ function params=3 ]]","useInsertionEffect":"[[ function params=2 ]]","useLayoutEffect":"[[ function params=2 ]]","useMemo":"[[ function params=2 ]]","useOptimistic":"[[ function params=2 ]]","useReducer":"[[ function params=3 ]]","useRef":"[[ function params=1 ]]","useState":"[[ function params=1 ]]","useSyncExternalStore":"[[ function params=3 ]]","useTransition":"[[ function params=0 ]]","version":"19.0.0-beta-b498834eab-20240506"},"[[ cyclic ref *6 ]]",true,true,true,true,"[[ function params=0 ]]",true,"[[ function params=0 ]]"] \ No newline at end of file diff --git a/compiler/packages/snap/src/sprout/evaluator.ts b/compiler/packages/snap/src/sprout/evaluator.ts index 77e8044fb5ed5..60da5dc53cec3 100644 --- a/compiler/packages/snap/src/sprout/evaluator.ts +++ b/compiler/packages/snap/src/sprout/evaluator.ts @@ -8,16 +8,11 @@ import {render} from '@testing-library/react'; import {JSDOM} from 'jsdom'; import React, {MutableRefObject} from 'react'; -// @ts-ignore -import {c as useMemoCache} from 'react/compiler-runtime'; import util from 'util'; import {z} from 'zod'; import {fromZodError} from 'zod-validation-error'; import {initFbt, toJSON} from './shared-runtime'; -// @ts-ignore -React.c = useMemoCache; - /** * Set up the global environment for JSDOM tests. * This is a hack to let us share code and setup between the test