From 2710795a1ed339764d2fa76b6d7bc94dded6ee60 Mon Sep 17 00:00:00 2001
From: Joseph Savona <6425824+josephsavona@users.noreply.github.com>
Date: Wed, 3 Sep 2025 21:30:52 -0700
Subject: [PATCH] [compiler] Cleanup for
@enablePreserveExistingMemoizationGuarantees (#34346)
I tried turning on `@enablePreserveExistingMemoizationGuarantees` by
default and cleaned up a couple small things:
* We emit freeze calls for StartMemoize deps but these had
ValueReason.Other so the message wasn't great. We now treat these like
other hook arguments.
* PruneNonEscapingScopes was being too aggressive in this mode and
memoizing even loads of globals. Switching to
MemoizationLevel.Conditional ensures we build a graph that connects
through to primitive-returning function calls, but doesn't unnecessarily
force memoization otherwise.
---
[//]: # (BEGIN SAPLING FOOTER)
Stack created with [Sapling](https://sapling-scm.com). Best reviewed
with [ReviewStack](https://reviewstack.dev/facebook/react/pull/34346).
* #34347
* __->__ #34346
---
.../Inference/InferMutationAliasingEffects.ts | 2 +-
.../ReactiveScopes/PruneNonEscapingScopes.ts | 6 +-
.../repro-cx-namespace-nesting.expect.md | 3 +-
.../meta-isms/repro-cx-namespace-nesting.js | 1 +
...da-with-fbt-preserve-memoization.expect.md | 86 +++++++++++++++++++
.../lambda-with-fbt-preserve-memoization.js | 31 +++++++
...signed-loop-force-scopes-enabled.expect.md | 32 ++++---
...ve-reassigned-loop-force-scopes-enabled.js | 2 +-
8 files changed, 139 insertions(+), 24 deletions(-)
create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-existing-memoization-guarantees/lambda-with-fbt-preserve-memoization.expect.md
create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-existing-memoization-guarantees/lambda-with-fbt-preserve-memoization.js
diff --git a/compiler/packages/babel-plugin-react-compiler/src/Inference/InferMutationAliasingEffects.ts b/compiler/packages/babel-plugin-react-compiler/src/Inference/InferMutationAliasingEffects.ts
index 8ef78aa196..a0e9593268 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/Inference/InferMutationAliasingEffects.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/Inference/InferMutationAliasingEffects.ts
@@ -2089,7 +2089,7 @@ function computeSignatureForInstruction(
effects.push({
kind: 'Freeze',
value: operand,
- reason: ValueReason.Other,
+ reason: ValueReason.HookCaptured,
});
}
}
diff --git a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts
index 1dcaf0b798..5735f7e801 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts
@@ -546,7 +546,7 @@ class CollectDependenciesVisitor extends ReactiveFunctionVisitor<
* memoization. Note: we may still prune primitive-producing scopes if
* they don't ultimately escape at all.
*/
- const level = MemoizationLevel.Memoized;
+ const level = MemoizationLevel.Conditional;
return {
lvalues: lvalue !== null ? [{place: lvalue, level}] : [],
rvalues: [...eachReactiveValueOperand(value)],
@@ -701,9 +701,7 @@ class CollectDependenciesVisitor extends ReactiveFunctionVisitor<
}
case 'ComputedLoad':
case 'PropertyLoad': {
- const level = options.forceMemoizePrimitives
- ? MemoizationLevel.Memoized
- : MemoizationLevel.Conditional;
+ const level = MemoizationLevel.Conditional;
return {
// Indirection for the inner value, memoized if the value is
lvalues: lvalue !== null ? [{place: lvalue, level}] : [],
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.expect.md
index 7f1fb96617..90de08f333 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.expect.md
@@ -2,6 +2,7 @@
## Input
```javascript
+// @compilationMode:"infer"
import {makeArray} from 'shared-runtime';
function Component() {
@@ -30,7 +31,7 @@ export const FIXTURE_ENTRYPOINT = {
## Code
```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @compilationMode:"infer"
import { makeArray } from "shared-runtime";
function Component() {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.js
index 352e2e5c19..41aebae7e3 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.js
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/meta-isms/repro-cx-namespace-nesting.js
@@ -1,3 +1,4 @@
+// @compilationMode:"infer"
import {makeArray} from 'shared-runtime';
function Component() {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-existing-memoization-guarantees/lambda-with-fbt-preserve-memoization.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-existing-memoization-guarantees/lambda-with-fbt-preserve-memoization.expect.md
new file mode 100644
index 0000000000..bafbb5c5ef
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-existing-memoization-guarantees/lambda-with-fbt-preserve-memoization.expect.md
@@ -0,0 +1,86 @@
+
+## Input
+
+```javascript
+// @enablePreserveExistingMemoizationGuarantees
+import {fbt} from 'fbt';
+
+function Component() {
+ const buttonLabel = () => {
+ if (!someCondition) {
+ return {'Purchase as a gift'};
+ } else if (
+ !iconOnly &&
+ showPrice &&
+ item?.current_gift_offer?.price?.formatted != null
+ ) {
+ return (
+
+ {'Gift | '}
+
+ {item?.current_gift_offer?.price?.formatted}
+
+
+ );
+ } else if (!iconOnly && !showPrice) {
+ return {'Gift'};
+ }
+ };
+
+ return (
+
+
+
+ );
+}
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees
+import { fbt } from "fbt";
+
+function Component() {
+ const $ = _c(1);
+ const buttonLabel = _temp;
+ let t0;
+ if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+ t0 = (
+
+
+
+ );
+ $[0] = t0;
+ } else {
+ t0 = $[0];
+ }
+ return t0;
+}
+function _temp() {
+ if (!someCondition) {
+ return fbt._("Purchase as a gift", null, { hk: "1gHj4g" });
+ } else {
+ if (
+ !iconOnly &&
+ showPrice &&
+ item?.current_gift_offer?.price?.formatted != null
+ ) {
+ return fbt._(
+ "Gift | {price}",
+ [fbt._param("price", item?.current_gift_offer?.price?.formatted)],
+ { hk: "3GTnGE" },
+ );
+ } else {
+ if (!iconOnly && !showPrice) {
+ return fbt._("Gift", null, { hk: "3fqfrk" });
+ }
+ }
+ }
+}
+
+```
+
+### Eval output
+(kind: exception) Fixture not implemented
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-existing-memoization-guarantees/lambda-with-fbt-preserve-memoization.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-existing-memoization-guarantees/lambda-with-fbt-preserve-memoization.js
new file mode 100644
index 0000000000..6b49c4a1fb
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-existing-memoization-guarantees/lambda-with-fbt-preserve-memoization.js
@@ -0,0 +1,31 @@
+// @enablePreserveExistingMemoizationGuarantees
+import {fbt} from 'fbt';
+
+function Component() {
+ const buttonLabel = () => {
+ if (!someCondition) {
+ return {'Purchase as a gift'};
+ } else if (
+ !iconOnly &&
+ showPrice &&
+ item?.current_gift_offer?.price?.formatted != null
+ ) {
+ return (
+
+ {'Gift | '}
+
+ {item?.current_gift_offer?.price?.formatted}
+
+
+ );
+ } else if (!iconOnly && !showPrice) {
+ return {'Gift'};
+ }
+ };
+
+ return (
+
+
+
+ );
+}
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/primitive-reassigned-loop-force-scopes-enabled.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/primitive-reassigned-loop-force-scopes-enabled.expect.md
index de39fc9706..6c2170feb6 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/primitive-reassigned-loop-force-scopes-enabled.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/primitive-reassigned-loop-force-scopes-enabled.expect.md
@@ -2,7 +2,7 @@
## Input
```javascript
-// @enableForest
+// @enablePreserveExistingMemoizationGuarantees
function Component({base, start, increment, test}) {
let value = base;
for (let i = start; i < test; i += increment) {
@@ -27,25 +27,23 @@ export const FIXTURE_ENTRYPOINT = {
## Code
```javascript
-import { c as _c } from "react/compiler-runtime"; // @enableForest
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees
function Component(t0) {
- const $ = _c(5);
+ const $ = _c(2);
const { base, start, increment, test } = t0;
- let value;
- if ($[0] !== base || $[1] !== increment || $[2] !== start || $[3] !== test) {
- value = base;
- for (let i = start; i < test; i = i + increment, i) {
- value = value + i;
- }
- $[0] = base;
- $[1] = increment;
- $[2] = start;
- $[3] = test;
- $[4] = value;
- } else {
- value = $[4];
+ let value = base;
+ for (let i = start; i < test; i = i + increment, i) {
+ value = value + i;
}
- return {value}
;
+ let t1;
+ if ($[0] !== value) {
+ t1 = {value}
;
+ $[0] = value;
+ $[1] = t1;
+ } else {
+ t1 = $[1];
+ }
+ return t1;
}
export const FIXTURE_ENTRYPOINT = {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/primitive-reassigned-loop-force-scopes-enabled.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/primitive-reassigned-loop-force-scopes-enabled.js
index cb4fc2050d..cce3123f94 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/primitive-reassigned-loop-force-scopes-enabled.js
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/primitive-reassigned-loop-force-scopes-enabled.js
@@ -1,4 +1,4 @@
-// @enableForest
+// @enablePreserveExistingMemoizationGuarantees
function Component({base, start, increment, test}) {
let value = base;
for (let i = start; i < test; i += increment) {