OSSForks/react
1
0
Fork 0
mirror of https://github.com/zebrajr/react.git synced 2025-12-06 12:20:20 +01:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

[compiler] Improve merging of scopes that invalidate together (#34049)

Browse Source 
We try to merge consecutive reactive scopes that will always invalidate
together, but there's one common case that isn't handled.

```js
const y = [[x]];
```

Here we'll create two consecutive scopes for the inner and outer array
expressions. Because the input to the second scope is a temporary,
they'll merge into one scope.

But if we name the inner array, the merging stops:

```js
const array = [x];
const y = [array];
```

This is because the merging logic checks if all the dependencies of the
second scope are outputs of the first scope, but doesn't account for
renaming due to LoadLocal/StoreLocal. The fix is to track these
temporaries.

---
[//]: # (BEGIN SAPLING FOOTER)
Stack created with [Sapling](https://sapling-scm.com). Best reviewed
with [ReviewStack](https://reviewstack.dev/facebook/react/pull/34049).
* __->__ #34049
* #34047
* #34044
This commit is contained in:
Joseph Savona 2025-08-01 13:00:01 -07:00 committed by GitHub
parent 0860b9cc1f
commit ddf8bc3fba
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
48 changed files with 412 additions and 744 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/MergeReactiveScopesThatInvalidateTogether.ts
View File

@ -119,6 +119,7 @@ class FindLastUsageVisitor extends ReactiveFunctionVisitor<void> {
class Transform extends ReactiveFunctionTransform<ReactiveScopeDependencies | null> {
lastUsage: Map<DeclarationId, InstructionId>;
temporaries: Map<DeclarationId, DeclarationId> = new Map();
constructor(lastUsage: Map<DeclarationId, InstructionId>) {
super();
@ -215,6 +216,12 @@ class Transform extends ReactiveFunctionTransform<ReactiveScopeDependencies | nu
current.lvalues.add(
instr.instruction.lvalue.identifier.declarationId,
);
if (instr.instruction.value.kind === 'LoadLocal') {
this.temporaries.set(
instr.instruction.lvalue.identifier.declarationId,
instr.instruction.value.place.identifier.declarationId,
);
}
}
break;
}
@ -236,6 +243,13 @@ class Transform extends ReactiveFunctionTransform<ReactiveScopeDependencies | nu
)) {
current.lvalues.add(lvalue.identifier.declarationId);
}
this.temporaries.set(
instr.instruction.value.lvalue.place.identifier
.declarationId,
this.temporaries.get(
instr.instruction.value.value.identifier.declarationId,
) ?? instr.instruction.value.value.identifier.declarationId,
);
} else {
log(
`Reset scope @${current.block.scope.id} from StoreLocal in [${instr.instruction.id}]`,
@ -260,7 +274,7 @@ class Transform extends ReactiveFunctionTransform<ReactiveScopeDependencies | nu
case 'scope': {
if (
current !== null &&
canMergeScopes(current.block, instr) &&
canMergeScopes(current.block, instr, this.temporaries) &&
areLValuesLastUsedByScope(
instr.scope,
current.lvalues,
@ -426,6 +440,7 @@ function areLValuesLastUsedByScope(
function canMergeScopes(
current: ReactiveScopeBlock,
next: ReactiveScopeBlock,
temporaries: Map<DeclarationId, DeclarationId>,
): boolean {
// Don't merge scopes with reassignments
if (
@ -465,11 +480,14 @@ function canMergeScopes(
(next.scope.dependencies.size !== 0 &&
[...next.scope.dependencies].every(
dep =>
dep.path.length === 0 &&
isAlwaysInvalidatingType(dep.identifier.type) &&
Iterable_some(
current.scope.declarations.values(),
decl =>
decl.identifier.declarationId === dep.identifier.declarationId,
decl.identifier.declarationId === dep.identifier.declarationId ||
decl.identifier.declarationId ===
temporaries.get(dep.identifier.declarationId),
),
))
) {
@ -477,8 +495,12 @@ function canMergeScopes(
return true;
}
log(` cannot merge scopes:`);
log(` ${printReactiveScopeSummary(current.scope)}`);
log(` ${printReactiveScopeSummary(next.scope)}`);
log(
` ${printReactiveScopeSummary(current.scope)} ${[...current.scope.declarations.values()].map(decl => decl.identifier.declarationId)}`,
);
log(
` ${printReactiveScopeSummary(next.scope)} ${[...next.scope.dependencies].map(dep => `${dep.identifier.declarationId} ${temporaries.get(dep.identifier.declarationId) ?? dep.identifier.declarationId}`)}`,
);
return false;
}

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-at-closure.expect.md
View File

@ -19,7 +19,7 @@ function Component(props) {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(7);
const $ = _c(5);
let t0;
if ($[0] !== props.x) {
t0 = foo(props.x);
@ -31,26 +31,19 @@ function Component(props) {
const x = t0;
let t1;
if ($[2] !== props || $[3] !== x) {
t1 = function () {
const fn = function () {
const arr = [...bar(props)];
return arr.at(x);
};
t1 = fn();
$[2] = props;
$[3] = x;
$[4] = t1;
} else {
t1 = $[4];
}
const fn = t1;
let t2;
if ($[5] !== fn) {
t2 = fn();
$[5] = fn;
$[6] = t2;
} else {
t2 = $[6];
}
const fnResult = t2;
const fnResult = t1;
return fnResult;
}

26
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-map-captures-receiver-noAlias.expect.md
View File

@ -23,34 +23,18 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(6);
const $ = _c(2);
let t0;
if ($[0] !== props.a) {
t0 = { a: props.a };
const item = { a: props.a };
const items = [item];
t0 = items.map(_temp);
$[0] = props.a;
$[1] = t0;
} else {
t0 = $[1];
}
const item = t0;
let t1;
if ($[2] !== item) {
t1 = [item];
$[2] = item;
$[3] = t1;
} else {
t1 = $[3];
}
const items = t1;
let t2;
if ($[4] !== items) {
t2 = items.map(_temp);
$[4] = items;
$[5] = t2;
} else {
t2 = $[5];
}
const mapped = t2;
const mapped = t0;
return mapped;
}
function _temp(item_0) {

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-map-noAlias-escaping-function.expect.md
View File

@ -21,26 +21,18 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
const f = _temp;
let t0;
if ($[0] !== props.items) {
t0 = [...props.items].map(f);
const x = [...props.items].map(f);
t0 = [x, f];
$[0] = props.items;
$[1] = t0;
} else {
t0 = $[1];
}
const x = t0;
let t1;
if ($[2] !== x) {
t1 = [x, f];
$[2] = x;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
function _temp(item) {
return item;

20
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-arrow-function-1.expect.md
View File

@ -23,27 +23,19 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function component(a) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== a) {
t0 = { a };
const z = { a };
t0 = () => {
console.log(z);
};
$[0] = a;
$[1] = t0;
} else {
t0 = $[1];
}
const z = t0;
let t1;
if ($[2] !== z) {
t1 = () => {
console.log(z);
};
$[2] = z;
$[3] = t1;
} else {
t1 = $[3];
}
const x = t1;
const x = t0;
return x;
}

20
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-function-1.expect.md
View File

@ -23,27 +23,19 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function component(a) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== a) {
t0 = { a };
const z = { a };
t0 = function () {
console.log(z);
};
$[0] = a;
$[1] = t0;
} else {
t0 = $[1];
}
const z = t0;
let t1;
if ($[2] !== z) {
t1 = function () {
console.log(z);
};
$[2] = z;
$[3] = t1;
} else {
t1 = $[3];
}
const x = t1;
const x = t0;
return x;
}

26
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-function-runs-inference.expect.md
View File

@ -22,35 +22,19 @@ export const FIXTURE_ENTRYPOINT = {
import { c as _c } from "react/compiler-runtime";
import { Stringify } from "shared-runtime";
function Component(t0) {
const $ = _c(6);
const $ = _c(2);
const { a } = t0;
let t1;
if ($[0] !== a) {
t1 = { a };
const z = { a };
const p = () => <Stringify>{z}</Stringify>;
t1 = p();
$[0] = a;
$[1] = t1;
} else {
t1 = $[1];
}
const z = t1;
let t2;
if ($[2] !== z) {
t2 = () => <Stringify>{z}</Stringify>;
$[2] = z;
$[3] = t2;
} else {
t2 = $[3];
}
const p = t2;
let t3;
if ($[4] !== p) {
t3 = p();
$[4] = p;
$[5] = t3;
} else {
t3 = $[5];
}
return t3;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

20
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-variable-in-nested-block.expect.md
View File

@ -25,27 +25,19 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function component(a) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== a) {
t0 = { a };
const z = { a };
t0 = function () {
console.log(z);
};
$[0] = a;
$[1] = t0;
} else {
t0 = $[1];
}
const z = t0;
let t1;
if ($[2] !== z) {
t1 = function () {
console.log(z);
};
$[2] = z;
$[3] = t1;
} else {
t1 = $[3];
}
const x = t1;
const x = t0;
return x;
}

24
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-variable-in-nested-function.expect.md
View File

@ -25,29 +25,21 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function component(a) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== a) {
t0 = { a };
const z = { a };
t0 = function () {
(function () {
console.log(z);
})();
};
$[0] = a;
$[1] = t0;
} else {
t0 = $[1];
}
const z = t0;
let t1;
if ($[2] !== z) {
t1 = function () {
(function () {
console.log(z);
})();
};
$[2] = z;
$[3] = t1;
} else {
t1 = $[3];
}
const x = t1;
const x = t0;
return x;
}

27
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/escape-analysis-non-escaping-interleaved-allocating-nested-dependency.expect.md
View File

@ -40,36 +40,29 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(7);
const $ = _c(5);
let t0;
if ($[0] !== props.a) {
t0 = [props.a];
const a = [props.a];
t0 = [a];
$[0] = props.a;
$[1] = t0;
} else {
t0 = $[1];
}
const a = t0;
let t1;
if ($[2] !== a) {
t1 = [a];
$[2] = a;
$[3] = t1;
} else {
t1 = $[3];
}
const b = t1;
const b = t0;
let c;
if ($[4] !== b || $[5] !== props.b) {
if ($[2] !== b || $[3] !== props.b) {
c = [];
const d = {};
d.b = b;
c.push(props.b);
$[4] = b;
$[5] = props.b;
$[6] = c;
$[2] = b;
$[3] = props.b;
$[4] = c;
} else {
c = $[6];
c = $[4];
}
return c;
}

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/fbt-param-with-newline.expect.md
View File

@ -32,10 +32,10 @@ import { c as _c } from "react/compiler-runtime";
import fbt from "fbt";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props.name) {
t0 = fbt._(
const element = fbt._(
"Hello {a really long description that got split into multiple lines}",
[
fbt._param(
@ -46,21 +46,14 @@ function Component(props) {
],
{ hk: "1euPUp" },
);
t0 = element.toString();
$[0] = props.name;
$[1] = t0;
} else {
t0 = $[1];
}
const element = t0;
let t1;
if ($[2] !== element) {
t1 = element.toString();
$[2] = element;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

29
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/fbt-param-with-quotes.expect.md
View File

@ -27,27 +27,28 @@ import { c as _c } from "react/compiler-runtime";
import fbt from "fbt";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props.name) {
t0 = fbt._('Hello {"user" name}', [fbt._param('"user" name', props.name)], {
hk: "S0vMe",
});
const element = fbt._(
'Hello {"user" name}',
[
fbt._param(
'"user" name',
props.name,
),
],
{ hk: "S0vMe" },
);
t0 = element.toString();
$[0] = props.name;
$[1] = t0;
} else {
t0 = $[1];
}
const element = t0;
let t1;
if ($[2] !== element) {
t1 = element.toString();
$[2] = element;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

25
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/fbt-param-with-unicode.expect.md
View File

@ -27,29 +27,28 @@ import { c as _c } from "react/compiler-runtime";
import fbt from "fbt";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props.name) {
t0 = fbt._(
const element = fbt._(
"Hello {user name ☺}",
[fbt._param("user name \u263A", props.name)],
[
fbt._param(
"user name \u263A",
props.name,
),
],
{ hk: "1En1lp" },
);
t0 = element.toString();
$[0] = props.name;
$[1] = t0;
} else {
t0 = $[1];
}
const element = t0;
let t1;
if ($[2] !== element) {
t1 = element.toString();
$[2] = element;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

29
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/fbt-to-string.expect.md
View File

@ -27,27 +27,28 @@ import { c as _c } from "react/compiler-runtime";
import fbt from "fbt";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props.name) {
t0 = fbt._("Hello {user name}", [fbt._param("user name", props.name)], {
hk: "2zEDKF",
});
const element = fbt._(
"Hello {user name}",
[
fbt._param(
"user name",
props.name,
),
],
{ hk: "2zEDKF" },
);
t0 = element.toString();
$[0] = props.name;
$[1] = t0;
} else {
t0 = $[1];
}
const element = t0;
let t1;
if ($[2] !== element) {
t1 = element.toString();
$[2] = element;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/function-expression-maybe-mutates-hook-return-value.expect.md
View File

@ -22,28 +22,21 @@ function Component(props) {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
const id = useSelectedEntitytId();
let t0;
if ($[0] !== id) {
t0 = () => {
const onLoad = () => {
log(id);
};
t0 = <Foo onLoad={onLoad} />;
$[0] = id;
$[1] = t0;
} else {
t0 = $[1];
}
const onLoad = t0;
let t1;
if ($[2] !== onLoad) {
t1 = <Foo onLoad={onLoad} />;
$[2] = onLoad;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
```

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/function-expression-prototype-call.expect.md
View File

@ -21,27 +21,20 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props) {
t0 = function () {
const f = function () {
return <div>{props.name}</div>;
};
t0 = f.call();
$[0] = props;
$[1] = t0;
} else {
t0 = $[1];
}
const f = t0;
let t1;
if ($[2] !== f) {
t1 = f.call();
$[2] = f;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hoisting-functionexpr-conditional-dep.expect.md
View File

@ -55,33 +55,26 @@ import { Stringify } from "shared-runtime";
* (kind: exception) Cannot read properties of null (reading 'prop')
*/
function Component(t0) {
const $ = _c(5);
const $ = _c(3);
const { obj, isObjNull } = t0;
let t1;
if ($[0] !== isObjNull || $[1] !== obj) {
t1 = () => {
const callback = () => {
if (!isObjNull) {
return obj.prop;
} else {
return null;
}
};
t1 = <Stringify shouldInvokeFns={true} callback={callback} />;
$[0] = isObjNull;
$[1] = obj;
$[2] = t1;
} else {
t1 = $[2];
}
const callback = t1;
let t2;
if ($[3] !== callback) {
t2 = <Stringify shouldInvokeFns={true} callback={callback} />;
$[3] = callback;
$[4] = t2;
} else {
t2 = $[4];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

29
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hoisting-setstate-captured-indirectly-jsx.expect.md
View File

@ -27,7 +27,7 @@ function useFoo() {
```javascript
import { c as _c } from "react/compiler-runtime"; // @validatePreserveExistingMemoizationGuarantees
function useFoo() {
const $ = _c(9);
const $ = _c(7);
const onClick = (response) => {
setState(DISABLED_FORM);
};
@ -48,31 +48,24 @@ function useFoo() {
const handleLogout = t1;
let t2;
if ($[2] !== handleLogout) {
t2 = () => <ColumnItem onPress={() => handleLogout()} />;
const getComponent = () => <ColumnItem onPress={() => handleLogout()} />;
t2 = getComponent();
$[2] = handleLogout;
$[3] = t2;
} else {
t2 = $[3];
}
const getComponent = t2;
let t3;
if ($[4] !== getComponent) {
t3 = getComponent();
$[4] = getComponent;
$[5] = t3;
if ($[4] !== onClick || $[5] !== t2) {
t3 = [t2, onClick];
$[4] = onClick;
$[5] = t2;
$[6] = t3;
} else {
t3 = $[5];
t3 = $[6];
}
let t4;
if ($[6] !== onClick || $[7] !== t3) {
t4 = [t3, onClick];
$[6] = onClick;
$[7] = t3;
$[8] = t4;
} else {
t4 = $[8];
}
return t4;
return t3;
}
```

76
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/inner-function/nullable-objects/array-map-named-chained-callbacks.expect.md
View File

@ -42,74 +42,58 @@ import { c as _c } from "react/compiler-runtime"; /**
* conservative and assume that all named lambdas are conditionally called.
*/
function useFoo(t0) {
const $ = _c(17);
const $ = _c(13);
const { arr1, arr2 } = t0;
let t1;
if ($[0] !== arr1[0]) {
t1 = () => arr1[0].value;
const getVal1 = () => arr1[0].value;
t1 = (e) => getVal1() + e.value;
$[0] = arr1[0];
$[1] = t1;
} else {
t1 = $[1];
}
const getVal1 = t1;
const cb1 = t1;
let t2;
if ($[2] !== getVal1) {
t2 = (e) => getVal1() + e.value;
$[2] = getVal1;
$[3] = t2;
if ($[2] !== arr1 || $[3] !== cb1) {
t2 = arr1.map(cb1);
$[2] = arr1;
$[3] = cb1;
$[4] = t2;
} else {
t2 = $[3];
t2 = $[4];
}
const cb1 = t2;
const x = t2;
let t3;
if ($[4] !== arr1 || $[5] !== cb1) {
t3 = arr1.map(cb1);
$[4] = arr1;
$[5] = cb1;
if ($[5] !== arr2) {
const getVal2 = () => arr2[0].value;
t3 = (e_0) => getVal2() + e_0.value;
$[5] = arr2;
$[6] = t3;
} else {
t3 = $[6];
}
const x = t3;
const cb2 = t3;
let t4;
if ($[7] !== arr2) {
t4 = () => arr2[0].value;
$[7] = arr2;
$[8] = t4;
if ($[7] !== arr1 || $[8] !== cb2) {
t4 = arr1.map(cb2);
$[7] = arr1;
$[8] = cb2;
$[9] = t4;
} else {
t4 = $[8];
t4 = $[9];
}
const getVal2 = t4;
const y = t4;
let t5;
if ($[9] !== getVal2) {
t5 = (e_0) => getVal2() + e_0.value;
$[9] = getVal2;
$[10] = t5;
if ($[10] !== x || $[11] !== y) {
t5 = [x, y];
$[10] = x;
$[11] = y;
$[12] = t5;
} else {
t5 = $[10];
t5 = $[12];
}
const cb2 = t5;
let t6;
if ($[11] !== arr1 || $[12] !== cb2) {
t6 = arr1.map(cb2);
$[11] = arr1;
$[12] = cb2;
$[13] = t6;
} else {
t6 = $[13];
}
const y = t6;
let t7;
if ($[14] !== x || $[15] !== y) {
t7 = [x, y];
$[14] = x;
$[15] = y;
$[16] = t7;
} else {
t7 = $[16];
}
return t7;
return t5;
}
export const FIXTURE_ENTRYPOINT = {

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/inner-function/nullable-objects/assume-invoked/conditional-call-chain.expect.md
View File

@ -42,7 +42,7 @@ import { useRef } from "react";
import { Stringify } from "shared-runtime";
function Component(t0) {
const $ = _c(9);
const $ = _c(7);
const { a, b } = t0;
let t1;
if ($[0] !== a.value) {
@ -70,29 +70,22 @@ function Component(t0) {
const hasLogged = useRef(false);
let t3;
if ($[4] !== logA || $[5] !== logB) {
t3 = () => {
const log = () => {
if (!hasLogged.current) {
logA();
logB();
hasLogged.current = true;
}
};
t3 = <Stringify log={log} shouldInvokeFns={true} />;
$[4] = logA;
$[5] = logB;
$[6] = t3;
} else {
t3 = $[6];
}
const log = t3;
let t4;
if ($[7] !== log) {
t4 = <Stringify log={log} shouldInvokeFns={true} />;
$[7] = log;
$[8] = t4;
} else {
t4 = $[8];
}
return t4;
return t3;
}
export const FIXTURE_ENTRYPOINT = {

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/jsx-lowercase-localvar-memberexpr-in-lambda.expect.md
View File

@ -24,28 +24,20 @@ import { c as _c } from "react/compiler-runtime";
import * as SharedRuntime from "shared-runtime";
import { invoke } from "shared-runtime";
function useComponentFactory(t0) {
const $ = _c(4);
const $ = _c(2);
const { name } = t0;
let t1;
if ($[0] !== name) {
t1 = () => (
const cb = () => (
<SharedRuntime.Stringify>hello world {name}</SharedRuntime.Stringify>
);
t1 = invoke(cb);
$[0] = name;
$[1] = t1;
} else {
t1 = $[1];
}
const cb = t1;
let t2;
if ($[2] !== cb) {
t2 = invoke(cb);
$[2] = cb;
$[3] = t2;
} else {
t2 = $[3];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

26
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/array-map-captures-receiver-noAlias.expect.md
View File

@ -25,34 +25,18 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime"; // @enableNewMutationAliasingModel
function Component(props) {
const $ = _c(6);
const $ = _c(2);
let t0;
if ($[0] !== props.a) {
t0 = { a: props.a };
const item = { a: props.a };
const items = [item];
t0 = items.map(_temp);
$[0] = props.a;
$[1] = t0;
} else {
t0 = $[1];
}
const item = t0;
let t1;
if ($[2] !== item) {
t1 = [item];
$[2] = item;
$[3] = t1;
} else {
t1 = $[3];
}
const items = t1;
let t2;
if ($[4] !== items) {
t2 = items.map(_temp);
$[4] = items;
$[5] = t2;
} else {
t2 = $[5];
}
const mapped = t2;
const mapped = t0;
return mapped;
}
function _temp(item_0) {

20
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/prop-capturing-function-1.expect.md
View File

@ -23,28 +23,20 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function component(a, b) {
const $ = _c(5);
const $ = _c(3);
let t0;
if ($[0] !== a || $[1] !== b) {
t0 = { a, b };
const z = { a, b };
t0 = function () {
console.log(z);
};
$[0] = a;
$[1] = b;
$[2] = t0;
} else {
t0 = $[2];
}
const z = t0;
let t1;
if ($[3] !== z) {
t1 = function () {
console.log(z);
};
$[3] = z;
$[4] = t1;
} else {
t1 = $[4];
}
const x = t1;
const x = t0;
return x;
}

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/reduce-reactive-deps/infer-function-uncond-access-local-var.expect.md
View File

@ -29,7 +29,7 @@ import { c as _c } from "react/compiler-runtime"; // @enablePropagateDepsInHIR
import { mutate, shallowCopy, Stringify } from "shared-runtime";
function useFoo(t0) {
const $ = _c(6);
const $ = _c(4);
const { a } = t0;
let local;
if ($[0] !== a) {
@ -42,22 +42,14 @@ function useFoo(t0) {
}
let t1;
if ($[2] !== local.b.c) {
t1 = () => local.b.c;
const fn = () => local.b.c;
t1 = <Stringify fn={fn} shouldInvokeFns={true} />;
$[2] = local.b.c;
$[3] = t1;
} else {
t1 = $[3];
}
const fn = t1;
let t2;
if ($[4] !== fn) {
t2 = <Stringify fn={fn} shouldInvokeFns={true} />;
$[4] = fn;
$[5] = t2;
} else {
t2 = $[5];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/reduce-reactive-deps/infer-nested-function-uncond-access-local-var.expect.md
View File

@ -29,7 +29,7 @@ import { c as _c } from "react/compiler-runtime"; // @enablePropagateDepsInHIR
import { shallowCopy, Stringify, mutate } from "shared-runtime";
function useFoo(t0) {
const $ = _c(6);
const $ = _c(4);
const { a } = t0;
let local;
if ($[0] !== a) {
@ -42,22 +42,14 @@ function useFoo(t0) {
}
let t1;
if ($[2] !== local) {
t1 = () => [() => local.b.c];
const fn = () => [() => local.b.c];
t1 = <Stringify fn={fn} shouldInvokeFns={true} />;
$[2] = local;
$[3] = t1;
} else {
t1 = $[3];
}
const fn = t1;
let t2;
if ($[4] !== fn) {
t2 = <Stringify fn={fn} shouldInvokeFns={true} />;
$[4] = fn;
$[5] = t2;
} else {
t2 = $[5];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/reduce-reactive-deps/infer-nested-function-uncond-access.expect.md
View File

@ -31,26 +31,19 @@ import { c as _c } from "react/compiler-runtime"; // @enablePropagateDepsInHIR
import { Stringify } from "shared-runtime";
function useFoo(t0) {
const $ = _c(4);
const $ = _c(2);
const { a } = t0;
let t1;
if ($[0] !== a.b.c) {
t1 = () => () => ({ value: a.b.c });
const fn = () => () => ({ value: a.b.c });
t1 = <Stringify fn={fn} shouldInvokeFns={true} />;
$[0] = a.b.c;
$[1] = t1;
} else {
t1 = $[1];
}
const fn = t1;
let t2;
if ($[2] !== fn) {
t2 = <Stringify fn={fn} shouldInvokeFns={true} />;
$[2] = fn;
$[3] = t2;
} else {
t2 = $[3];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/reduce-reactive-deps/infer-object-method-uncond-access.expect.md
View File

@ -31,30 +31,23 @@ import { c as _c } from "react/compiler-runtime"; // @enablePropagateDepsInHIR
import { identity, Stringify } from "shared-runtime";
function useFoo(t0) {
const $ = _c(4);
const $ = _c(2);
const { a } = t0;
let t1;
if ($[0] !== a) {
t1 = {
const x = {
fn() {
return identity(a.b.c);
},
};
t1 = <Stringify x={x} shouldInvokeFns={true} />;
$[0] = a;
$[1] = t1;
} else {
t1 = $[1];
}
const x = t1;
let t2;
if ($[2] !== x) {
t2 = <Stringify x={x} shouldInvokeFns={true} />;
$[2] = x;
$[3] = t2;
} else {
t2 = $[3];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/prune-scopes-whose-deps-invalidate-jsx.expect.md
View File

@ -29,7 +29,7 @@ import { c as _c } from "react/compiler-runtime";
import { useHook } from "shared-runtime";
function Component(props) {
const $ = _c(6);
const $ = _c(4);
const o = {};
let t0;
if ($[0] !== props.value) {
@ -44,22 +44,15 @@ function Component(props) {
o.value = props.value;
let t1;
if ($[2] !== x) {
t1 = <div>{x}</div>;
const y = <div>{x}</div>;
t1 = <div>{y}</div>;
$[2] = x;
$[3] = t1;
} else {
t1 = $[3];
}
const y = t1;
let t2;
if ($[4] !== y) {
t2 = <div>{y}</div>;
$[4] = y;
$[5] = t2;
} else {
t2 = $[5];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/prune-scopes-whose-deps-may-invalidate-array.expect.md
View File

@ -31,7 +31,7 @@ import { c as _c } from "react/compiler-runtime";
import { useHook, identity } from "shared-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let x = 42;
if (props.cond) {
x = [];
@ -41,22 +41,15 @@ function Component(props) {
identity(x);
let t0;
if ($[0] !== x) {
t0 = [x];
const y = [x];
t0 = [y];
$[0] = x;
$[1] = t0;
} else {
t0 = $[1];
}
const y = t0;
let t1;
if ($[2] !== y) {
t1 = [y];
$[2] = y;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reactive-ref-param.expect.md
View File

@ -66,25 +66,17 @@ function Parent(t0) {
}
function ChildImpl(_props, ref) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== ref) {
t0 = () => ref.current;
const cb = () => ref.current;
t0 = <Stringify cb={cb} shouldInvokeFns={true} />;
$[0] = ref;
$[1] = t0;
} else {
t0 = $[1];
}
const cb = t0;
let t1;
if ($[2] !== cb) {
t1 = <Stringify cb={cb} shouldInvokeFns={true} />;
$[2] = cb;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
const Child = forwardRef(ChildImpl);

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reactive-ref.expect.md
View File

@ -41,29 +41,21 @@ import { Stringify } from "shared-runtime";
* `pruneNonReactiveDependencies`
*/
function Component(t0) {
const $ = _c(4);
const $ = _c(2);
const { cond } = t0;
const ref1 = useRef(1);
const ref2 = useRef(2);
const ref = cond ? ref1 : ref2;
let t1;
if ($[0] !== ref) {
t1 = () => ref.current;
const cb = () => ref.current;
t1 = <Stringify cb={cb} shouldInvokeFns={true} />;
$[0] = ref;
$[1] = t1;
} else {
t1 = $[1];
}
const cb = t1;
let t2;
if ($[2] !== cb) {
t2 = <Stringify cb={cb} shouldInvokeFns={true} />;
$[2] = cb;
$[3] = t2;
} else {
t2 = $[3];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

27
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reactivity-analysis-interleaved-reactivity.expect.md
View File

@ -35,34 +35,23 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(6);
let a;
const $ = _c(2);
let t0;
if ($[0] !== props.b) {
a = {};
const a = {};
const b = [];
b.push(props.b);
a.a = null;
t0 = [a];
const c = [a];
t0 = [c, a];
$[0] = props.b;
$[1] = a;
$[2] = t0;
$[1] = t0;
} else {
a = $[1];
t0 = $[2];
t0 = $[1];
}
const c = t0;
let t1;
if ($[3] !== a || $[4] !== c) {
t1 = [c, a];
$[3] = a;
$[4] = c;
$[5] = t1;
} else {
t1 = $[5];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

20
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reactivity-via-aliased-mutation-array.expect.md
View File

@ -32,18 +32,24 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(2);
let t0;
const $ = _c(4);
let x;
if ($[0] !== props.input) {
const x = [];
x = [];
const y = x;
y.push(props.input);
t0 = [x[0]];
$[0] = props.input;
$[1] = t0;
$[1] = x;
} else {
t0 = $[1];
x = $[1];
}
let t0;
if ($[2] !== x[0]) {
t0 = [x[0]];
$[2] = x[0];
$[3] = t0;
} else {
t0 = $[3];
}
return t0;
}

20
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reactivity-via-aliased-mutation-lambda.expect.md
View File

@ -35,22 +35,28 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(2);
let t0;
const $ = _c(4);
let x;
if ($[0] !== props.input) {
const x = [];
x = [];
const f = (arg) => {
const y = x;
y.push(arg);
};
f(props.input);
t0 = [x[0]];
$[0] = props.input;
$[1] = t0;
$[1] = x;
} else {
t0 = $[1];
x = $[1];
}
let t0;
if ($[2] !== x[0]) {
t0 = [x[0]];
$[2] = x[0];
$[3] = t0;
} else {
t0 = $[3];
}
return t0;
}

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-aliased-not-added-to-dep-2.expect.md
View File

@ -18,28 +18,21 @@ function Foo({a}) {
```javascript
import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRender:false
function Foo(t0) {
const $ = _c(4);
const $ = _c(2);
const { a } = t0;
const ref = useRef();
const val = ref.current;
let t1;
if ($[0] !== a) {
t1 = { a, val };
const x = { a, val };
t1 = <VideoList videos={x} />;
$[0] = a;
$[1] = t1;
} else {
t1 = $[1];
}
const x = t1;
let t2;
if ($[2] !== x) {
t2 = <VideoList videos={x} />;
$[2] = x;
$[3] = t2;
} else {
t2 = $[3];
}
return t2;
return t1;
}
```

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-not-added-to-dep-2.expect.md
View File

@ -17,27 +17,20 @@ function Foo({a}) {
```javascript
import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRender:false
function Foo(t0) {
const $ = _c(4);
const $ = _c(2);
const { a } = t0;
const ref = useRef();
let t1;
if ($[0] !== a) {
t1 = { a, val: ref.current };
const x = { a, val: ref.current };
t1 = <VideoList videos={x} />;
$[0] = a;
$[1] = t1;
} else {
t1 = $[1];
}
const x = t1;
let t2;
if ($[2] !== x) {
t2 = <VideoList videos={x} />;
$[2] = x;
$[3] = t2;
} else {
t2 = $[3];
}
return t2;
return t1;
}
```

18
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rename-source-variables-nested-function.expect.md
View File

@ -41,11 +41,11 @@ const $ = "module_$";
const t0 = "module_t0";
const c_0 = "module_c_0";
function useFoo(props) {
const $0 = _c(4);
const $0 = _c(2);
const c_00 = $0[0] !== props.value;
let t1;
if (c_00) {
t1 = () => {
const a = () => {
const b = () => {
const c = () => {
console.log($);
@ -57,22 +57,14 @@ function useFoo(props) {
};
return b;
};
t1 = a()()();
$0[0] = props.value;
$0[1] = t1;
} else {
t1 = $0[1];
}
const a = t1;
const c_2 = $0[2] !== a;
let t2;
if (c_2) {
t2 = a()()();
$0[2] = a;
$0[3] = t2;
} else {
t2 = $0[3];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

50
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/repro-missing-memoization-lack-of-phi-types-explicit-types.expect.md
View File

@ -35,60 +35,44 @@ import { useMemo } from "react";
import { useFragment } from "shared-runtime";
function Component() {
const $ = _c(11);
const $ = _c(7);
const data = useFragment();
let t0;
if ($[0] !== data.nodes) {
t0 = data.nodes ?? [];
const nodes = data.nodes ?? [];
const flatMap = nodes.flatMap(_temp);
t0 = flatMap.filter(_temp2);
$[0] = data.nodes;
$[1] = t0;
} else {
t0 = $[1];
}
const nodes = t0;
const filtered = t0;
let t1;
if ($[2] !== nodes) {
t1 = nodes.flatMap(_temp);
$[2] = nodes;
if ($[2] !== filtered) {
t1 = filtered.map();
$[2] = filtered;
$[3] = t1;
} else {
t1 = $[3];
}
const flatMap = t1;
let t2;
if ($[4] !== flatMap) {
t2 = flatMap.filter(_temp2);
$[4] = flatMap;
$[5] = t2;
} else {
t2 = $[5];
}
const filtered = t2;
let t3;
if ($[6] !== filtered) {
t3 = filtered.map();
$[6] = filtered;
$[7] = t3;
} else {
t3 = $[7];
}
const map = t3;
const map = t1;
const index = filtered.findIndex(_temp3);
let t4;
if ($[8] !== index || $[9] !== map) {
t4 = (
let t2;
if ($[4] !== index || $[5] !== map) {
t2 = (
<div>
{map}
{index}
</div>
);
$[8] = index;
$[9] = map;
$[10] = t4;
$[4] = index;
$[5] = map;
$[6] = t2;
} else {
t4 = $[10];
t2 = $[6];
}
return t4;
return t2;
}
function _temp3(x) {
return x === null;

50
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/repro-missing-memoization-lack-of-phi-types.expect.md
View File

@ -32,60 +32,44 @@ import { useMemo } from "react";
import { useFragment } from "shared-runtime";
function Component() {
const $ = _c(11);
const $ = _c(7);
const data = useFragment();
let t0;
if ($[0] !== data.nodes) {
t0 = data.nodes ?? [];
const nodes = data.nodes ?? [];
const flatMap = nodes.flatMap(_temp);
t0 = flatMap.filter(_temp2);
$[0] = data.nodes;
$[1] = t0;
} else {
t0 = $[1];
}
const nodes = t0;
const filtered = t0;
let t1;
if ($[2] !== nodes) {
t1 = nodes.flatMap(_temp);
$[2] = nodes;
if ($[2] !== filtered) {
t1 = filtered.map();
$[2] = filtered;
$[3] = t1;
} else {
t1 = $[3];
}
const flatMap = t1;
let t2;
if ($[4] !== flatMap) {
t2 = flatMap.filter(_temp2);
$[4] = flatMap;
$[5] = t2;
} else {
t2 = $[5];
}
const filtered = t2;
let t3;
if ($[6] !== filtered) {
t3 = filtered.map();
$[6] = filtered;
$[7] = t3;
} else {
t3 = $[7];
}
const map = t3;
const map = t1;
const index = filtered.findIndex(_temp3);
let t4;
if ($[8] !== index || $[9] !== map) {
t4 = (
let t2;
if ($[4] !== index || $[5] !== map) {
t2 = (
<div>
{map}
{index}
</div>
);
$[8] = index;
$[9] = map;
$[10] = t4;
$[4] = index;
$[5] = map;
$[6] = t2;
} else {
t4 = $[10];
t2 = $[6];
}
return t4;
return t2;
}
function _temp3(x) {
return x === null;

25
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/repro-mutate-result-of-function-call-with-frozen-argument-in-function-expression.expect.md
View File

@ -30,40 +30,33 @@ import { c as _c } from "react/compiler-runtime";
import { identity, makeObject_Primitives, Stringify } from "shared-runtime";
function Example(props) {
const $ = _c(7);
const $ = _c(5);
const object = props.object;
let t0;
if ($[0] !== object || $[1] !== props.value) {
t0 = () => {
const f = () => {
const obj = identity(object);
obj.property = props.value;
return obj;
};
t0 = f();
$[0] = object;
$[1] = props.value;
$[2] = t0;
} else {
t0 = $[2];
}
const f = t0;
const obj_0 = t0;
let t1;
if ($[3] !== f) {
t1 = f();
$[3] = f;
if ($[3] !== obj_0) {
t1 = <Stringify obj={obj_0} />;
$[3] = obj_0;
$[4] = t1;
} else {
t1 = $[4];
}
const obj_0 = t1;
let t2;
if ($[5] !== obj_0) {
t2 = <Stringify obj={obj_0} />;
$[5] = obj_0;
$[6] = t2;
} else {
t2 = $[6];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

25
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/repro-mutate-result-of-method-call-on-frozen-value-in-function-expression.expect.md
View File

@ -30,40 +30,33 @@ import { c as _c } from "react/compiler-runtime";
import { makeObject_Primitives, Stringify } from "shared-runtime";
function Example(props) {
const $ = _c(7);
const $ = _c(5);
const object = props.object;
let t0;
if ($[0] !== object || $[1] !== props.value) {
t0 = () => {
const f = () => {
const obj = object.makeObject();
obj.property = props.value;
return obj;
};
t0 = f();
$[0] = object;
$[1] = props.value;
$[2] = t0;
} else {
t0 = $[2];
}
const f = t0;
const obj_0 = t0;
let t1;
if ($[3] !== f) {
t1 = f();
$[3] = f;
if ($[3] !== obj_0) {
t1 = <Stringify obj={obj_0} />;
$[3] = obj_0;
$[4] = t1;
} else {
t1 = $[4];
}
const obj_0 = t1;
let t2;
if ($[5] !== obj_0) {
t2 = <Stringify obj={obj_0} />;
$[5] = obj_0;
$[6] = t2;
} else {
t2 = $[6];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {

87
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/repro-renaming-conflicting-decls.expect.md
View File

@ -45,7 +45,7 @@ import { Stringify, identity, makeArray, toJSON } from "shared-runtime";
import { useMemo } from "react";
function Component(props) {
const $ = _c(12);
const $ = _c(10);
let t0;
let t1;
if ($[0] !== props) {
@ -71,57 +71,50 @@ function Component(props) {
}
let t2;
if ($[3] !== t0) {
t2 = { url: t0 };
const linkProps = { url: t0 };
const x = {};
let t3;
let t4;
let t5;
let t6;
let t7;
if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
t3 = [1];
t4 = [2];
t5 = [3];
t6 = [4];
t7 = [5];
$[5] = t3;
$[6] = t4;
$[7] = t5;
$[8] = t6;
$[9] = t7;
} else {
t3 = $[5];
t4 = $[6];
t5 = $[7];
t6 = $[8];
t7 = $[9];
}
t2 = (
<Stringify
link={linkProps}
val1={t3}
val2={t4}
val3={t5}
val4={t6}
val5={t7}
>
{makeArray(x, 2)}
</Stringify>
);
$[3] = t0;
$[4] = t2;
} else {
t2 = $[4];
}
const linkProps = t2;
let t3;
if ($[5] !== linkProps) {
const x = {};
let t4;
let t5;
let t6;
let t7;
let t8;
if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
t4 = [1];
t5 = [2];
t6 = [3];
t7 = [4];
t8 = [5];
$[7] = t4;
$[8] = t5;
$[9] = t6;
$[10] = t7;
$[11] = t8;
} else {
t4 = $[7];
t5 = $[8];
t6 = $[9];
t7 = $[10];
t8 = $[11];
}
t3 = (
<Stringify
link={linkProps}
val1={t4}
val2={t5}
val3={t6}
val4={t7}
val5={t8}
>
{makeArray(x, 2)}
</Stringify>
);
$[5] = linkProps;
$[6] = t3;
} else {
t3 = $[6];
}
return t3;
return t2;
}
export const FIXTURE_ENTRYPOINT = {

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/repro-undefined-expression-of-jsxexpressioncontainer.expect.md
View File

@ -48,28 +48,21 @@ import { c as _c } from "react/compiler-runtime";
import { StaticText1, Stringify, Text } from "shared-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
const { buttons } = props;
let t0;
if ($[0] !== buttons) {
const [, ...nonPrimaryButtons] = buttons;
t0 = nonPrimaryButtons.map(_temp);
const renderedNonPrimaryButtons = nonPrimaryButtons.map(_temp);
t0 = <StaticText1>{renderedNonPrimaryButtons}</StaticText1>;
$[0] = buttons;
$[1] = t0;
} else {
t0 = $[1];
}
const renderedNonPrimaryButtons = t0;
let t1;
if ($[2] !== renderedNonPrimaryButtons) {
t1 = <StaticText1>{renderedNonPrimaryButtons}</StaticText1>;
$[2] = renderedNonPrimaryButtons;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
function _temp(buttonProps, i) {
return (

17
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/try-catch-within-function-expression-returns-caught-value.expect.md
View File

@ -29,10 +29,10 @@ import { c as _c } from "react/compiler-runtime";
import { throwInput } from "shared-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props) {
t0 = () => {
const callback = () => {
try {
throwInput([props.value]);
} catch (t1) {
@ -40,21 +40,14 @@ function Component(props) {
return e;
}
};
t0 = callback();
$[0] = props;
$[1] = t0;
} else {
t0 = $[1];
}
const callback = t0;
let t1;
if ($[2] !== callback) {
t1 = callback();
$[2] = callback;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/type-annotations/type-annotation-var-array.expect.md
View File

@ -25,25 +25,17 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime"; // @enableUseTypeAnnotations
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props.id) {
t0 = makeArray(props.id);
const x = makeArray(props.id);
t0 = x.at(0);
$[0] = props.id;
$[1] = t0;
} else {
t0 = $[1];
}
const x = t0;
let t1;
if ($[2] !== x) {
t1 = x.at(0);
$[2] = x;
$[3] = t1;
} else {
t1 = $[3];
}
const y = t1;
const y = t0;
return y;
}

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/type-annotations/type-annotation-var-array_.flow.expect.md
View File

@ -29,25 +29,17 @@ import { c as _c } from "react/compiler-runtime";
import { identity } from "shared-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props.id) {
t0 = makeArray(props.id);
const x = makeArray(props.id);
t0 = x.at(0);
$[0] = props.id;
$[1] = t0;
} else {
t0 = $[1];
}
const x = t0;
let t1;
if ($[2] !== x) {
t1 = x.at(0);
$[2] = x;
$[3] = t1;
} else {
t1 = $[3];
}
const y = t1;
const y = t0;
return y;
}

16
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/use-memo-simple.expect.md
View File

@ -22,25 +22,17 @@ export const FIXTURE_ENTRYPOINT = {
import { c as _c } from "react/compiler-runtime";
function Component(props) {
"use memo";
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props.foo) {
t0 = [props.foo];
const x = [props.foo];
t0 = <div x={x}>"foo"</div>;
$[0] = props.foo;
$[1] = t0;
} else {
t0 = $[1];
}
const x = t0;
let t1;
if ($[2] !== x) {
t1 = <div x={x}>"foo"</div>;
$[2] = x;
$[3] = t1;
} else {
t1 = $[3];
}
return t1;
return t0;
}
export const FIXTURE_ENTRYPOINT = {

25
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useContext-read-context-in-callback-if-condition.expect.md
View File

@ -39,41 +39,34 @@ import { Stringify } from "shared-runtime";
const FooContext = createContext({ current: true });
function Component(props) {
const $ = _c(6);
const $ = _c(4);
const foo = useContext(FooContext);
let t0;
if ($[0] !== foo.current) {
t0 = () => {
const getValue = () => {
if (foo.current) {
return {};
} else {
return null;
}
};
t0 = getValue();
$[0] = foo.current;
$[1] = t0;
} else {
t0 = $[1];
}
const getValue = t0;
const value = t0;
let t1;
if ($[2] !== getValue) {
t1 = getValue();
$[2] = getValue;
if ($[2] !== value) {
t1 = <Stringify value={value} />;
$[2] = value;
$[3] = t1;
} else {
t1 = $[3];
}
const value = t1;
let t2;
if ($[4] !== value) {
t2 = <Stringify value={value} />;
$[4] = value;
$[5] = t2;
} else {
t2 = $[5];
}
return t2;
return t1;
}
export const FIXTURE_ENTRYPOINT = {