Facebook/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2025-11-01 09:12:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

[compiler] Delete propagateScopeDeps (non-hir)

Browse Source 
`enablePropagateScopeDepsHIR` is now used extensively in Meta. This has been tested for over two weeks in our e2e tests and production.

The rest of this stack deletes `LoweredFunction.dependencies`, which the non-hir version of `PropagateScopeDeps` depends on. To avoid a more forked HIR (non-hir with dependencies and hir with no dependencies), let's go ahead and clean up the non-hir version of PropagateScopeDepsHIR.

Note that all fixture changes in this PR were previously reviewed when they were copied to `propagate-scope-deps-hir-fork`. Will clean up / merge these duplicate fixtures in a later PR

'
This commit is contained in:
Mofei Zhang
2024-11-05 14:03:37 -05:00
parent e288deabd7
commit 19506bc5d8
61 changed files with 567 additions and 1869 deletions
Download Patch File Download Diff File Expand all files Collapse all files
compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Pipeline.ts
+6 -18
View File
@@ -57,7 +57,6 @@ import {
mergeReactiveScopesThatInvalidateTogether,
promoteUsedTemporaries,
propagateEarlyReturns,
propagateScopeDependencies,
pruneHoistedContexts,
pruneNonEscapingScopes,
pruneNonReactiveDependencies,
@@ -348,14 +347,12 @@ function* runWithEnvironment(
});
assertTerminalSuccessorsExist(hir);
assertTerminalPredsExist(hir);
if (env.config.enablePropagateDepsInHIR) {
propagateScopeDependenciesHIR(hir);
yield log({
kind: 'hir',
name: 'PropagateScopeDependenciesHIR',
value: hir,
});
}
propagateScopeDependenciesHIR(hir);
yield log({
kind: 'hir',
name: 'PropagateScopeDependenciesHIR',
value: hir,
});
if (env.config.inlineJsxTransform) {
inlineJsxTransform(hir, env.config.inlineJsxTransform);
@@ -383,15 +380,6 @@ function* runWithEnvironment(
});
assertScopeInstructionsWithinScopes(reactiveFunction);
if (!env.config.enablePropagateDepsInHIR) {
propagateScopeDependencies(reactiveFunction);
yield log({
kind: 'reactive',
name: 'PropagateScopeDependencies',
value: reactiveFunction,
});
}
pruneNonEscapingScopes(reactiveFunction);
yield log({
kind: 'reactive',
compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts
-10
View File
@@ -231,16 +231,6 @@ const EnvironmentConfigSchema = z.object({
*/
enableUseTypeAnnotations: z.boolean().default(false),
enablePropagateDepsInHIR: z.boolean().default(false),
/**
* Enables inference of optional dependency chains. Without this flag
* a property chain such as `props?.items?.foo` will infer as a dep on
* just `props`. With this flag enabled, we'll infer that full path as
* the dependency.
*/
enableOptionalDependencies: z.boolean().default(true),
/**
* Enables inlining ReactElement object literals in place of JSX
* An alternative to the standard JSX transform which replaces JSX with React's jsxProd() runtime
compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PropagateScopeDependencies.ts
-1324
View File
File diff suppressed because it is too large Load Diff
compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/index.ts
-1
View File
@@ -17,7 +17,6 @@ export {mergeReactiveScopesThatInvalidateTogether} from './MergeReactiveScopesTh
export {printReactiveFunction} from './PrintReactiveFunction';
export {promoteUsedTemporaries} from './PromoteUsedTemporaries';
export {propagateEarlyReturns} from './PropagateEarlyReturns';
export {propagateScopeDependencies} from './PropagateScopeDependencies';
export {pruneAllReactiveScopes} from './PruneAllReactiveScopes';
export {pruneHoistedContexts} from './PruneHoistedContexts';
export {pruneNonEscapingScopes} from './PruneNonEscapingScopes';
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/bug-invalid-hoisting-functionexpr.expect.md
+2 -2
View File
@@ -58,7 +58,7 @@ function Component(t0) {
const $ = _c(5);
const { obj, isObjNull } = t0;
let t1;
if ($[0] !== isObjNull || $[1] !== obj.prop) {
if ($[0] !== isObjNull || $[1] !== obj) {
t1 = () => {
if (!isObjNull) {
return obj.prop;
@@ -67,7 +67,7 @@ function Component(t0) {
}
};
$[0] = isObjNull;
$[1] = obj.prop;
$[1] = obj;
$[2] = t1;
} else {
t1 = $[2];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/bug-try-catch-maybe-null-dependency.expect.md
+12 -4
View File
@@ -38,16 +38,24 @@ import { identity } from "shared-runtime";
* try-catch block, as that might throw
*/
function useFoo(maybeNullObject) {
const $ = _c(2);
const $ = _c(4);
let y;
if ($[0] !== maybeNullObject.value.inner) {
if ($[0] !== maybeNullObject) {
y = [];
try {
y.push(identity(maybeNullObject.value.inner));
let t0;
if ($[2] !== maybeNullObject.value.inner) {
t0 = identity(maybeNullObject.value.inner);
$[2] = maybeNullObject.value.inner;
$[3] = t0;
} else {
t0 = $[3];
}
y.push(t0);
} catch {
y.push("null");
}
$[0] = maybeNullObject.value.inner;
$[0] = maybeNullObject;
$[1] = y;
} else {
y = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-mutate-2.expect.md
+2 -2
View File
@@ -37,7 +37,7 @@ function component(a, b) {
}
const y = t0;
let z;
if ($[2] !== a || $[3] !== y.b) {
if ($[2] !== a || $[3] !== y) {
z = { a };
const x = function () {
z.a = 2;
@@ -45,7 +45,7 @@ function component(a, b) {
x();
$[2] = a;
$[3] = y.b;
$[3] = y;
$[4] = z;
} else {
z = $[4];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/conditional-break-labeled.expect.md
+13 -5
View File
@@ -33,9 +33,14 @@ import { c as _c } from "react/compiler-runtime"; /**
* props.b *does* influence `a`
*/
function Component(props) {
const $ = _c(2);
const $ = _c(5);
let a;
if ($[0] !== props) {
if (
$[0] !== props.a ||
$[1] !== props.b ||
$[2] !== props.c ||
$[3] !== props.d
) {
a = [];
a.push(props.a);
bb0: {
@@ -47,10 +52,13 @@ function Component(props) {
}
a.push(props.d);
$[0] = props;
$[1] = a;
$[0] = props.a;
$[1] = props.b;
$[2] = props.c;
$[3] = props.d;
$[4] = a;
} else {
a = $[1];
a = $[4];
}
return a;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/conditional-early-return.expect.md
+52 -26
View File
@@ -70,10 +70,10 @@ import { c as _c } from "react/compiler-runtime"; /**
* props.b does *not* influence `a`
*/
function ComponentA(props) {
const $ = _c(3);
const $ = _c(5);
let a_DEBUG;
let t0;
if ($[0] !== props) {
if ($[0] !== props.a || $[1] !== props.b || $[2] !== props.d) {
t0 = Symbol.for("react.early_return_sentinel");
bb0: {
a_DEBUG = [];
@@ -85,12 +85,14 @@ function ComponentA(props) {
a_DEBUG.push(props.d);
}
$[0] = props;
$[1] = a_DEBUG;
$[2] = t0;
$[0] = props.a;
$[1] = props.b;
$[2] = props.d;
$[3] = a_DEBUG;
$[4] = t0;
} else {
a_DEBUG = $[1];
t0 = $[2];
a_DEBUG = $[3];
t0 = $[4];
}
if (t0 !== Symbol.for("react.early_return_sentinel")) {
return t0;
@@ -102,9 +104,14 @@ function ComponentA(props) {
* props.b *does* influence `a`
*/
function ComponentB(props) {
const $ = _c(2);
const $ = _c(5);
let a;
if ($[0] !== props) {
if (
$[0] !== props.a ||
$[1] !== props.b ||
$[2] !== props.c ||
$[3] !== props.d
) {
a = [];
a.push(props.a);
if (props.b) {
@@ -112,10 +119,13 @@ function ComponentB(props) {
}
a.push(props.d);
$[0] = props;
$[1] = a;
$[0] = props.a;
$[1] = props.b;
$[2] = props.c;
$[3] = props.d;
$[4] = a;
} else {
a = $[1];
a = $[4];
}
return a;
}
@@ -124,10 +134,15 @@ function ComponentB(props) {
* props.b *does* influence `a`, but only in a way that is never observable
*/
function ComponentC(props) {
const $ = _c(3);
const $ = _c(6);
let a;
let t0;
if ($[0] !== props) {
if (
$[0] !== props.a ||
$[1] !== props.b ||
$[2] !== props.c ||
$[3] !== props.d
) {
t0 = Symbol.for("react.early_return_sentinel");
bb0: {
a = [];
@@ -140,12 +155,15 @@ function ComponentC(props) {
a.push(props.d);
}
$[0] = props;
$[1] = a;
$[2] = t0;
$[0] = props.a;
$[1] = props.b;
$[2] = props.c;
$[3] = props.d;
$[4] = a;
$[5] = t0;
} else {
a = $[1];
t0 = $[2];
a = $[4];
t0 = $[5];
}
if (t0 !== Symbol.for("react.early_return_sentinel")) {
return t0;
@@ -157,10 +175,15 @@ function ComponentC(props) {
* props.b *does* influence `a`
*/
function ComponentD(props) {
const $ = _c(3);
const $ = _c(6);
let a;
let t0;
if ($[0] !== props) {
if (
$[0] !== props.a ||
$[1] !== props.b ||
$[2] !== props.c ||
$[3] !== props.d
) {
t0 = Symbol.for("react.early_return_sentinel");
bb0: {
a = [];
@@ -173,12 +196,15 @@ function ComponentD(props) {
a.push(props.d);
}
$[0] = props;
$[1] = a;
$[2] = t0;
$[0] = props.a;
$[1] = props.b;
$[2] = props.c;
$[3] = props.d;
$[4] = a;
$[5] = t0;
} else {
a = $[1];
t0 = $[2];
a = $[4];
t0 = $[5];
}
if (t0 !== Symbol.for("react.early_return_sentinel")) {
return t0;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/conditional-on-mutable.expect.md
+14 -10
View File
@@ -36,9 +36,9 @@ function mayMutate() {}
```javascript
import { c as _c } from "react/compiler-runtime";
function ComponentA(props) {
const $ = _c(2);
const $ = _c(4);
let t0;
if ($[0] !== props) {
if ($[0] !== props.p0 || $[1] !== props.p1 || $[2] !== props.p2) {
const a = [];
const b = [];
if (b) {
@@ -49,18 +49,20 @@ function ComponentA(props) {
}
t0 = <Foo a={a} b={b} />;
$[0] = props;
$[1] = t0;
$[0] = props.p0;
$[1] = props.p1;
$[2] = props.p2;
$[3] = t0;
} else {
t0 = $[1];
t0 = $[3];
}
return t0;
}
function ComponentB(props) {
const $ = _c(2);
const $ = _c(4);
let t0;
if ($[0] !== props) {
if ($[0] !== props.p0 || $[1] !== props.p1 || $[2] !== props.p2) {
const a = [];
const b = [];
if (mayMutate(b)) {
@@ -71,10 +73,12 @@ function ComponentB(props) {
}
t0 = <Foo a={a} b={b} />;
$[0] = props;
$[1] = t0;
$[0] = props.p0;
$[1] = props.p1;
$[2] = props.p2;
$[3] = t0;
} else {
t0 = $[1];
t0 = $[3];
}
return t0;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/early-return-nested-early-return-within-reactive-scope.expect.md
+14 -12
View File
@@ -31,9 +31,9 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(5);
const $ = _c(7);
let t0;
if ($[0] !== props) {
if ($[0] !== props.cond || $[1] !== props.a || $[2] !== props.b) {
t0 = Symbol.for("react.early_return_sentinel");
bb0: {
const x = [];
@@ -41,12 +41,12 @@ function Component(props) {
x.push(props.a);
if (props.b) {
let t1;
if ($[2] !== props.b) {
if ($[4] !== props.b) {
t1 = [props.b];
$[2] = props.b;
$[3] = t1;
$[4] = props.b;
$[5] = t1;
} else {
t1 = $[3];
t1 = $[5];
}
const y = t1;
x.push(y);
@@ -58,20 +58,22 @@ function Component(props) {
break bb0;
} else {
let t1;
if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
t1 = foo();
$[4] = t1;
$[6] = t1;
} else {
t1 = $[4];
t1 = $[6];
}
t0 = t1;
break bb0;
}
}
$[0] = props;
$[1] = t0;
$[0] = props.cond;
$[1] = props.a;
$[2] = props.b;
$[3] = t0;
} else {
t0 = $[1];
t0 = $[3];
}
if (t0 !== Symbol.for("react.early_return_sentinel")) {
return t0;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/early-return-within-reactive-scope.expect.md
+11 -9
View File
@@ -45,9 +45,9 @@ import { c as _c } from "react/compiler-runtime";
import { makeArray } from "shared-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(6);
let t0;
if ($[0] !== props) {
if ($[0] !== props.cond || $[1] !== props.a || $[2] !== props.b) {
t0 = Symbol.for("react.early_return_sentinel");
bb0: {
const x = [];
@@ -57,21 +57,23 @@ function Component(props) {
break bb0;
} else {
let t1;
if ($[2] !== props.b) {
if ($[4] !== props.b) {
t1 = makeArray(props.b);
$[2] = props.b;
$[3] = t1;
$[4] = props.b;
$[5] = t1;
} else {
t1 = $[3];
t1 = $[5];
}
t0 = t1;
break bb0;
}
}
$[0] = props;
$[1] = t0;
$[0] = props.cond;
$[1] = props.a;
$[2] = props.b;
$[3] = t0;
} else {
t0 = $[1];
t0 = $[3];
}
if (t0 !== Symbol.for("react.early_return_sentinel")) {
return t0;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional-optional.expect.md
+50
View File
@@ -0,0 +1,50 @@
## Input
```javascript
// @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import {ValidateMemoization} from 'shared-runtime';
function Component(props) {
const data = useMemo(() => {
const x = [];
x.push(props?.items);
if (props.cond) {
x.push(props?.items);
}
return x;
}, [props?.items, props.cond]);
return (
<ValidateMemoization inputs={[props?.items, props.cond]} output={data} />
);
}
```
## Error
```
2 | import {ValidateMemoization} from 'shared-runtime';
3 | function Component(props) {
> 4 | const data = useMemo(() => {
| ^^^^^^^
> 5 | const x = [];
| ^^^^^^^^^^^^^^^^^
> 6 | x.push(props?.items);
| ^^^^^^^^^^^^^^^^^
> 7 | if (props.cond) {
| ^^^^^^^^^^^^^^^^^
> 8 | x.push(props?.items);
| ^^^^^^^^^^^^^^^^^
> 9 | }
| ^^^^^^^^^^^^^^^^^
> 10 | return x;
| ^^^^^^^^^^^^^^^^^
> 11 | }, [props?.items, props.cond]);
| ^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. The inferred dependencies did not match the manually specified dependencies, which could cause the value to change more or less frequently than expected (4:11)
12 | return (
13 | <ValidateMemoization inputs={[props?.items, props.cond]} output={data} />
14 | );
```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-member-expression-with-conditional-optional.js → compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional-optional.js
View File
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional.expect.md
+50
View File
@@ -0,0 +1,50 @@
## Input
```javascript
// @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import {ValidateMemoization} from 'shared-runtime';
function Component(props) {
const data = useMemo(() => {
const x = [];
x.push(props?.items);
if (props.cond) {
x.push(props.items);
}
return x;
}, [props?.items, props.cond]);
return (
<ValidateMemoization inputs={[props?.items, props.cond]} output={data} />
);
}
```
## Error
```
2 | import {ValidateMemoization} from 'shared-runtime';
3 | function Component(props) {
> 4 | const data = useMemo(() => {
| ^^^^^^^
> 5 | const x = [];
| ^^^^^^^^^^^^^^^^^
> 6 | x.push(props?.items);
| ^^^^^^^^^^^^^^^^^
> 7 | if (props.cond) {
| ^^^^^^^^^^^^^^^^^
> 8 | x.push(props.items);
| ^^^^^^^^^^^^^^^^^
> 9 | }
| ^^^^^^^^^^^^^^^^^
> 10 | return x;
| ^^^^^^^^^^^^^^^^^
> 11 | }, [props?.items, props.cond]);
| ^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. The inferred dependencies did not match the manually specified dependencies, which could cause the value to change more or less frequently than expected (4:11)
12 | return (
13 | <ValidateMemoization inputs={[props?.items, props.cond]} output={data} />
14 | );
```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-member-expression-with-conditional.js → compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional.js
View File
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-optional.expect.md
+1 -1
View File
@@ -25,7 +25,7 @@ export const FIXTURE_ENTRYPONT = {
1 | function useFoo(props: {value: {x: string; y: string} | null}) {
2 | const value = props.value;
> 3 | return createArray(value?.x, value?.y)?.join(', ');
| ^^^^^^^^ Todo: Unexpected terminal kind `optional` for optional test block (3:3)
| ^^^^^^^^ Todo: Unexpected terminal kind `optional` for optional fallthrough block (3:3)
4 | }
5 |
6 | function createArray<T>(...args: Array<T>): Array<T> {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/functionexpr-conditional-access-2.expect.md
+2 -2
View File
@@ -2,7 +2,7 @@
## Input
```javascript
// @enableTreatFunctionDepsAsConditional @enablePropagateDepsInHIR:false
// @enableTreatFunctionDepsAsConditional
import {Stringify} from 'shared-runtime';
function Component({props}) {
@@ -20,7 +20,7 @@ export const FIXTURE_ENTRYPOINT = {
## Code
```javascript
import { c as _c } from "react/compiler-runtime"; // @enableTreatFunctionDepsAsConditional @enablePropagateDepsInHIR:false
import { c as _c } from "react/compiler-runtime"; // @enableTreatFunctionDepsAsConditional
import { Stringify } from "shared-runtime";
function Component(t0) {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/functionexpr-conditional-access-2.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
// @enableTreatFunctionDepsAsConditional @enablePropagateDepsInHIR:false
// @enableTreatFunctionDepsAsConditional
import {Stringify} from 'shared-runtime';
function Component({props}) {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/functionexpr–conditional-access.expect.md
+4 -4
View File
@@ -2,7 +2,7 @@
## Input
```javascript
// @enableTreatFunctionDepsAsConditional @enablePropagateDepsInHIR:false
// @enableTreatFunctionDepsAsConditional
function Component(props) {
function getLength() {
return props.bar.length;
@@ -21,15 +21,15 @@ export const FIXTURE_ENTRYPOINT = {
## Code
```javascript
import { c as _c } from "react/compiler-runtime"; // @enableTreatFunctionDepsAsConditional @enablePropagateDepsInHIR:false
import { c as _c } from "react/compiler-runtime"; // @enableTreatFunctionDepsAsConditional
function Component(props) {
const $ = _c(5);
let t0;
if ($[0] !== props) {
if ($[0] !== props.bar) {
t0 = function getLength() {
return props.bar.length;
};
$[0] = props;
$[0] = props.bar;
$[1] = t0;
} else {
t0 = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/functionexpr–conditional-access.js
+1 -1
View File
@@ -1,4 +1,4 @@
// @enableTreatFunctionDepsAsConditional @enablePropagateDepsInHIR:false
// @enableTreatFunctionDepsAsConditional
function Component(props) {
function getLength() {
return props.bar.length;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/iife-return-modified-later-phi.expect.md
+6 -5
View File
@@ -26,9 +26,9 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(2);
const $ = _c(3);
let items;
if ($[0] !== props) {
if ($[0] !== props.cond || $[1] !== props.a) {
let t0;
if (props.cond) {
t0 = [];
@@ -38,10 +38,11 @@ function Component(props) {
items = t0;
items?.push(props.a);
$[0] = props;
$[1] = items;
$[0] = props.cond;
$[1] = props.a;
$[2] = items;
} else {
items = $[1];
items = $[2];
}
return items;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-sequential-optional-chain-nonnull.expect.md
+2 -2
View File
@@ -33,11 +33,11 @@ function useFoo(t0) {
const $ = _c(2);
const { a } = t0;
let x;
if ($[0] !== a.b.c.d) {
if ($[0] !== a.b.c.d.e) {
x = [];
x.push(a?.b.c?.d.e);
x.push(a.b?.c.d?.e);
$[0] = a.b.c.d;
$[0] = a.b.c.d.e;
$[1] = x;
} else {
x = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/nested-optional-chains.expect.md
+6 -6
View File
@@ -120,29 +120,29 @@ function useFoo(t0) {
}
const x = t1;
let t2;
if ($[2] !== prop2?.inner) {
if ($[2] !== prop2?.inner.value) {
t2 = identity(prop2?.inner.value)?.toString();
$[2] = prop2?.inner;
$[2] = prop2?.inner.value;
$[3] = t2;
} else {
t2 = $[3];
}
const y = t2;
let t3;
if ($[4] !== prop3 || $[5] !== prop4) {
if ($[4] !== prop3 || $[5] !== prop4?.inner) {
t3 = prop3?.fn(prop4?.inner.value).toString();
$[4] = prop3;
$[5] = prop4;
$[5] = prop4?.inner;
$[6] = t3;
} else {
t3 = $[6];
}
const z = t3;
let t4;
if ($[7] !== prop5 || $[8] !== prop6) {
if ($[7] !== prop5 || $[8] !== prop6?.inner) {
t4 = prop5?.fn(prop6?.inner.value)?.toString();
$[7] = prop5;
$[8] = prop6;
$[8] = prop6?.inner;
$[9] = t4;
} else {
t4 = $[9];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/object-mutated-in-consequent-alternate-both-return.expect.md
+6 -5
View File
@@ -29,9 +29,9 @@ import { c as _c } from "react/compiler-runtime";
import { makeObject_Primitives } from "shared-runtime";
function Component(props) {
const $ = _c(2);
const $ = _c(3);
let t0;
if ($[0] !== props) {
if ($[0] !== props.cond || $[1] !== props.value) {
t0 = Symbol.for("react.early_return_sentinel");
bb0: {
const object = makeObject_Primitives();
@@ -45,10 +45,11 @@ function Component(props) {
break bb0;
}
}
$[0] = props;
$[1] = t0;
$[0] = props.cond;
$[1] = props.value;
$[2] = t0;
} else {
t0 = $[1];
t0 = $[2];
}
if (t0 !== Symbol.for("react.early_return_sentinel")) {
return t0;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-member-expression-with-conditional-optional.expect.md
-74
View File
@@ -1,74 +0,0 @@
## Input
```javascript
// @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import {ValidateMemoization} from 'shared-runtime';
function Component(props) {
const data = useMemo(() => {
const x = [];
x.push(props?.items);
if (props.cond) {
x.push(props?.items);
}
return x;
}, [props?.items, props.cond]);
return (
<ValidateMemoization inputs={[props?.items, props.cond]} output={data} />
);
}
```
## Code
```javascript
import { c as _c } from "react/compiler-runtime"; // @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import { ValidateMemoization } from "shared-runtime";
function Component(props) {
const $ = _c(9);
props?.items;
let t0;
let x;
if ($[0] !== props?.items || $[1] !== props.cond) {
x = [];
x.push(props?.items);
if (props.cond) {
x.push(props?.items);
}
$[0] = props?.items;
$[1] = props.cond;
$[2] = x;
} else {
x = $[2];
}
t0 = x;
const data = t0;
const t1 = props?.items;
let t2;
if ($[3] !== t1 || $[4] !== props.cond) {
t2 = [t1, props.cond];
$[3] = t1;
$[4] = props.cond;
$[5] = t2;
} else {
t2 = $[5];
}
let t3;
if ($[6] !== t2 || $[7] !== data) {
t3 = <ValidateMemoization inputs={t2} output={data} />;
$[6] = t2;
$[7] = data;
$[8] = t3;
} else {
t3 = $[8];
}
return t3;
}
```
### Eval output
(kind: exception) Fixture not implemented
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-member-expression-with-conditional.expect.md
-74
View File
@@ -1,74 +0,0 @@
## Input
```javascript
// @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import {ValidateMemoization} from 'shared-runtime';
function Component(props) {
const data = useMemo(() => {
const x = [];
x.push(props?.items);
if (props.cond) {
x.push(props.items);
}
return x;
}, [props?.items, props.cond]);
return (
<ValidateMemoization inputs={[props?.items, props.cond]} output={data} />
);
}
```
## Code
```javascript
import { c as _c } from "react/compiler-runtime"; // @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import { ValidateMemoization } from "shared-runtime";
function Component(props) {
const $ = _c(9);
props?.items;
let t0;
let x;
if ($[0] !== props?.items || $[1] !== props.cond) {
x = [];
x.push(props?.items);
if (props.cond) {
x.push(props.items);
}
$[0] = props?.items;
$[1] = props.cond;
$[2] = x;
} else {
x = $[2];
}
t0 = x;
const data = t0;
const t1 = props?.items;
let t2;
if ($[3] !== t1 || $[4] !== props.cond) {
t2 = [t1, props.cond];
$[3] = t1;
$[4] = props.cond;
$[5] = t2;
} else {
t2 = $[5];
}
let t3;
if ($[6] !== t2 || $[7] !== data) {
t3 = <ValidateMemoization inputs={t2} output={data} />;
$[6] = t2;
$[7] = data;
$[8] = t3;
} else {
t3 = $[8];
}
return t3;
}
```
### Eval output
(kind: exception) Fixture not implemented
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/partial-early-return-within-reactive-scope.expect.md
+12 -10
View File
@@ -30,10 +30,10 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(6);
let y;
let t0;
if ($[0] !== props) {
if ($[0] !== props.cond || $[1] !== props.a || $[2] !== props.b) {
t0 = Symbol.for("react.early_return_sentinel");
bb0: {
const x = [];
@@ -43,11 +43,11 @@ function Component(props) {
break bb0;
} else {
let t1;
if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
t1 = foo();
$[3] = t1;
$[5] = t1;
} else {
t1 = $[3];
t1 = $[5];
}
y = t1;
if (props.b) {
@@ -56,12 +56,14 @@ function Component(props) {
}
}
}
$[0] = props;
$[1] = y;
$[2] = t0;
$[0] = props.cond;
$[1] = props.a;
$[2] = props.b;
$[3] = y;
$[4] = t0;
} else {
y = $[1];
t0 = $[2];
y = $[3];
t0 = $[4];
}
if (t0 !== Symbol.for("react.early_return_sentinel")) {
return t0;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/phi-type-inference-array-push-consecutive-phis.expect.md
+13 -5
View File
@@ -49,7 +49,7 @@ import { c as _c } from "react/compiler-runtime";
import { makeArray } from "shared-runtime";
function Component(props) {
const $ = _c(3);
const $ = _c(6);
let t0;
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
t0 = {};
@@ -59,7 +59,12 @@ function Component(props) {
}
const x = t0;
let t1;
if ($[1] !== props) {
if (
$[1] !== props.cond ||
$[2] !== props.cond2 ||
$[3] !== props.value ||
$[4] !== props.value2
) {
let y;
if (props.cond) {
if (props.cond2) {
@@ -74,10 +79,13 @@ function Component(props) {
y.push(x);
t1 = [x, y];
$[1] = props;
$[2] = t1;
$[1] = props.cond;
$[2] = props.cond2;
$[3] = props.value;
$[4] = props.value2;
$[5] = t1;
} else {
t1 = $[2];
t1 = $[5];
}
return t1;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/phi-type-inference-array-push.expect.md
+6 -5
View File
@@ -36,7 +36,7 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(3);
const $ = _c(4);
let t0;
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
t0 = {};
@@ -46,7 +46,7 @@ function Component(props) {
}
const x = t0;
let t1;
if ($[1] !== props) {
if ($[1] !== props.cond || $[2] !== props.value) {
let y;
if (props.cond) {
y = [props.value];
@@ -57,10 +57,11 @@ function Component(props) {
y.push(x);
t1 = [x, y];
$[1] = props;
$[2] = t1;
$[1] = props.cond;
$[2] = props.value;
$[3] = t1;
} else {
t1 = $[2];
t1 = $[3];
}
return t1;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/phi-type-inference-property-store.expect.md
+6 -5
View File
@@ -32,7 +32,7 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime"; // @debug
function Component(props) {
const $ = _c(3);
const $ = _c(4);
let t0;
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
t0 = {};
@@ -42,7 +42,7 @@ function Component(props) {
}
const x = t0;
let t1;
if ($[1] !== props) {
if ($[1] !== props.cond || $[2] !== props.a) {
let y;
if (props.cond) {
y = {};
@@ -53,10 +53,11 @@ function Component(props) {
y.x = x;
t1 = [x, y];
$[1] = props;
$[2] = t1;
$[1] = props.cond;
$[2] = props.a;
$[3] = t1;
} else {
t1 = $[2];
t1 = $[3];
}
return t1;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.expect.md
+50
View File
@@ -0,0 +1,50 @@
## Input
```javascript
// @validatePreserveExistingMemoizationGuarantees
import {useCallback} from 'react';
function Component({propA, propB}) {
return useCallback(() => {
if (propA) {
return {
value: propB.x.y,
};
}
}, [propA, propB.x.y]);
}
export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{propA: 1, propB: {x: {y: []}}}],
};
```
## Error
```
3 |
4 | function Component({propA, propB}) {
> 5 | return useCallback(() => {
| ^^^^^^^
> 6 | if (propA) {
| ^^^^^^^^^^^^^^^^
> 7 | return {
| ^^^^^^^^^^^^^^^^
> 8 | value: propB.x.y,
| ^^^^^^^^^^^^^^^^
> 9 | };
| ^^^^^^^^^^^^^^^^
> 10 | }
| ^^^^^^^^^^^^^^^^
> 11 | }, [propA, propB.x.y]);
| ^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. The inferred dependencies did not match the manually specified dependencies, which could cause the value to change more or less frequently than expected (5:11)
12 | }
13 |
14 | export const FIXTURE_ENTRYPOINT = {
```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useCallback-conditional-access-own-scope.ts → compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.ts
View File
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-infer-conditional-value-block.expect.md
+59
View File
@@ -0,0 +1,59 @@
## Input
```javascript
// @validatePreserveExistingMemoizationGuarantees
import {useCallback} from 'react';
import {identity, mutate} from 'shared-runtime';
function useHook(propA, propB) {
return useCallback(() => {
const x = {};
if (identity(null) ?? propA.a) {
mutate(x);
return {
value: propB.x.y,
};
}
}, [propA.a, propB.x.y]);
}
export const FIXTURE_ENTRYPOINT = {
fn: useHook,
params: [{a: 1}, {x: {y: 3}}],
};
```
## Error
```
4 |
5 | function useHook(propA, propB) {
> 6 | return useCallback(() => {
| ^^^^^^^
> 7 | const x = {};
| ^^^^^^^^^^^^^^^^^
> 8 | if (identity(null) ?? propA.a) {
| ^^^^^^^^^^^^^^^^^
> 9 | mutate(x);
| ^^^^^^^^^^^^^^^^^
> 10 | return {
| ^^^^^^^^^^^^^^^^^
> 11 | value: propB.x.y,
| ^^^^^^^^^^^^^^^^^
> 12 | };
| ^^^^^^^^^^^^^^^^^
> 13 | }
| ^^^^^^^^^^^^^^^^^
> 14 | }, [propA.a, propB.x.y]);
| ^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. The inferred dependencies did not match the manually specified dependencies, which could cause the value to change more or less frequently than expected (6:14)
CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. The inferred dependencies did not match the manually specified dependencies, which could cause the value to change more or less frequently than expected (6:14)
15 | }
16 |
17 | export const FIXTURE_ENTRYPOINT = {
```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useCallback-infer-conditional-value-block.ts → compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-infer-conditional-value-block.ts
View File
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-infer-less-specific-conditional-access.expect.md
+2
View File
@@ -44,6 +44,8 @@ function Component({propA, propB}) {
| ^^^^^^^^^^^^^^^^^
> 14 | }, [propA?.a, propB.x.y]);
| ^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. The inferred dependencies did not match the manually specified dependencies, which could cause the value to change more or less frequently than expected (6:14)
CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. The inferred dependencies did not match the manually specified dependencies, which could cause the value to change more or less frequently than expected (6:14)
15 | }
16 |
```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useCallback-conditional-access-own-scope.expect.md
-58
View File
@@ -1,58 +0,0 @@
## Input
```javascript
// @validatePreserveExistingMemoizationGuarantees
import {useCallback} from 'react';
function Component({propA, propB}) {
return useCallback(() => {
if (propA) {
return {
value: propB.x.y,
};
}
}, [propA, propB.x.y]);
}
export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{propA: 1, propB: {x: {y: []}}}],
};
```
## Code
```javascript
import { c as _c } from "react/compiler-runtime"; // @validatePreserveExistingMemoizationGuarantees
import { useCallback } from "react";
function Component(t0) {
const $ = _c(3);
const { propA, propB } = t0;
let t1;
if ($[0] !== propA || $[1] !== propB.x.y) {
t1 = () => {
if (propA) {
return { value: propB.x.y };
}
};
$[0] = propA;
$[1] = propB.x.y;
$[2] = t1;
} else {
t1 = $[2];
}
return t1;
}
export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{ propA: 1, propB: { x: { y: [] } } }],
};
```
### Eval output
(kind: ok) "[[ function params=0 ]]"
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useCallback-infer-conditional-value-block.expect.md
-63
View File
@@ -1,63 +0,0 @@
## Input
```javascript
// @validatePreserveExistingMemoizationGuarantees
import {useCallback} from 'react';
import {identity, mutate} from 'shared-runtime';
function useHook(propA, propB) {
return useCallback(() => {
const x = {};
if (identity(null) ?? propA.a) {
mutate(x);
return {
value: propB.x.y,
};
}
}, [propA.a, propB.x.y]);
}
export const FIXTURE_ENTRYPOINT = {
fn: useHook,
params: [{a: 1}, {x: {y: 3}}],
};
```
## Code
```javascript
import { c as _c } from "react/compiler-runtime"; // @validatePreserveExistingMemoizationGuarantees
import { useCallback } from "react";
import { identity, mutate } from "shared-runtime";
function useHook(propA, propB) {
const $ = _c(3);
let t0;
if ($[0] !== propA.a || $[1] !== propB.x.y) {
t0 = () => {
const x = {};
if (identity(null) ?? propA.a) {
mutate(x);
return { value: propB.x.y };
}
};
$[0] = propA.a;
$[1] = propB.x.y;
$[2] = t0;
} else {
t0 = $[2];
}
return t0;
}
export const FIXTURE_ENTRYPOINT = {
fn: useHook,
params: [{ a: 1 }, { x: { y: 3 } }],
};
```
### Eval output
(kind: ok) "[[ function params=0 ]]"
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reactive-dependencies-non-optional-properties-inside-optional-chain.expect.md
+2 -2
View File
@@ -15,9 +15,9 @@ import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(2);
let t0;
if ($[0] !== props.post.feedback.comments) {
if ($[0] !== props.post.feedback.comments?.edges) {
t0 = props.post.feedback.comments?.edges?.map(render);
$[0] = props.post.feedback.comments;
$[0] = props.post.feedback.comments?.edges;
$[1] = t0;
} else {
t0 = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reassigned-phi-in-returned-function-expression.expect.md
+2 -2
View File
@@ -23,7 +23,7 @@ import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(2);
let t0;
if ($[0] !== props.str) {
if ($[0] !== props) {
t0 = () => {
let str;
if (arguments.length) {
@@ -34,7 +34,7 @@ function Component(props) {
global.log(str);
};
$[0] = props.str;
$[0] = props;
$[1] = t0;
} else {
t0 = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/bug-infer-function-cond-access-not-hoisted.expect.md
+2 -2
View File
@@ -38,7 +38,7 @@ function Foo(t0) {
const $ = _c(3);
const { a, shouldReadA } = t0;
let t1;
if ($[0] !== shouldReadA || $[1] !== a.b.c) {
if ($[0] !== shouldReadA || $[1] !== a) {
t1 = (
<Stringify
fn={() => {
@@ -51,7 +51,7 @@ function Foo(t0) {
/>
);
$[0] = shouldReadA;
$[1] = a.b.c;
$[1] = a;
$[2] = t1;
} else {
t1 = $[2];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/bug-merge-uncond-optional-chain-and-cond.expect.md
+2 -2
View File
@@ -65,12 +65,12 @@ function useFoo(t0) {
const $ = _c(2);
const { screen } = t0;
let t1;
if ($[0] !== screen?.title_text) {
if ($[0] !== screen) {
t1 =
screen?.title_text != null
? "(not null)"
: identity({ title: screen.title_text });
$[0] = screen?.title_text;
$[0] = screen;
$[1] = t1;
} else {
t1 = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/join-uncond-scopes-cond-deps.expect.md
+4 -11
View File
@@ -61,20 +61,13 @@ import { c as _c } from "react/compiler-runtime"; // This tests an optimization,
import { CONST_TRUE, setProperty } from "shared-runtime";
function useJoinCondDepsInUncondScopes(props) {
const $ = _c(4);
const $ = _c(2);
let t0;
if ($[0] !== props.a.b) {
const y = {};
let x;
if ($[2] !== props) {
x = {};
if (CONST_TRUE) {
setProperty(x, props.a.b);
}
$[2] = props;
$[3] = x;
} else {
x = $[3];
const x = {};
if (CONST_TRUE) {
setProperty(x, props.a.b);
}
setProperty(y, props.a.b);
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/promote-uncond.expect.md
+7 -6
View File
@@ -34,19 +34,20 @@ import { identity } from "shared-runtime";
// and promote it to an unconditional dependency.
function usePromoteUnconditionalAccessToDependency(props, other) {
const $ = _c(3);
const $ = _c(4);
let x;
if ($[0] !== props.a || $[1] !== other) {
if ($[0] !== props.a.a.a || $[1] !== props.a.b || $[2] !== other) {
x = {};
x.a = props.a.a.a;
if (identity(other)) {
x.c = props.a.b.c;
}
$[0] = props.a;
$[1] = other;
$[2] = x;
$[0] = props.a.a.a;
$[1] = props.a.b;
$[2] = other;
$[3] = x;
} else {
x = $[2];
x = $[3];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-cascading-eliminated-phis.expect.md
+17 -8
View File
@@ -36,10 +36,16 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(4);
const $ = _c(7);
let x = 0;
let values;
if ($[0] !== props || $[1] !== x) {
if (
$[0] !== props.a ||
$[1] !== props.b ||
$[2] !== props.c ||
$[3] !== props.d ||
$[4] !== x
) {
values = [];
const y = props.a || props.b;
values.push(y);
@@ -53,13 +59,16 @@ function Component(props) {
}
values.push(x);
$[0] = props;
$[1] = x;
$[2] = values;
$[3] = x;
$[0] = props.a;
$[1] = props.b;
$[2] = props.c;
$[3] = props.d;
$[4] = x;
$[5] = values;
$[6] = x;
} else {
values = $[2];
x = $[3];
values = $[5];
x = $[6];
}
return values;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-leave-case.expect.md
+6 -5
View File
@@ -39,9 +39,9 @@ import { c as _c } from "react/compiler-runtime";
import { Stringify } from "shared-runtime";
function Component(props) {
const $ = _c(2);
const $ = _c(3);
let t0;
if ($[0] !== props) {
if ($[0] !== props.p0 || $[1] !== props.p1) {
const x = [];
let y;
if (props.p0) {
@@ -55,10 +55,11 @@ function Component(props) {
{y}
</Stringify>
);
$[0] = props;
$[1] = t0;
$[0] = props.p0;
$[1] = props.p1;
$[2] = t0;
} else {
t0 = $[1];
t0 = $[2];
}
return t0;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-ternary-destruction-with-mutation.expect.md
+7 -5
View File
@@ -31,17 +31,19 @@ import { c as _c } from "react/compiler-runtime";
import { mutate } from "shared-runtime";
function useFoo(props) {
const $ = _c(2);
const $ = _c(4);
let x;
if ($[0] !== props) {
if ($[0] !== props.bar || $[1] !== props.cond || $[2] !== props.foo) {
x = [];
x.push(props.bar);
props.cond ? (([x] = [[]]), x.push(props.foo)) : null;
mutate(x);
$[0] = props;
$[1] = x;
$[0] = props.bar;
$[1] = props.cond;
$[2] = props.foo;
$[3] = x;
} else {
x = $[1];
x = $[3];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-ternary-destruction.expect.md
+6 -5
View File
@@ -26,7 +26,7 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function useFoo(props) {
const $ = _c(4);
const $ = _c(5);
let x;
if ($[0] !== props.bar) {
x = [];
@@ -36,12 +36,13 @@ function useFoo(props) {
} else {
x = $[1];
}
if ($[2] !== props) {
if ($[2] !== props.cond || $[3] !== props.foo) {
props.cond ? (([x] = [[]]), x.push(props.foo)) : null;
$[2] = props;
$[3] = x;
$[2] = props.cond;
$[3] = props.foo;
$[4] = x;
} else {
x = $[3];
x = $[4];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-ternary-with-mutation.expect.md
+7 -5
View File
@@ -31,17 +31,19 @@ import { c as _c } from "react/compiler-runtime";
import { mutate } from "shared-runtime";
function useFoo(props) {
const $ = _c(2);
const $ = _c(4);
let x;
if ($[0] !== props) {
if ($[0] !== props.bar || $[1] !== props.cond || $[2] !== props.foo) {
x = [];
x.push(props.bar);
props.cond ? ((x = []), x.push(props.foo)) : null;
mutate(x);
$[0] = props;
$[1] = x;
$[0] = props.bar;
$[1] = props.cond;
$[2] = props.foo;
$[3] = x;
} else {
x = $[1];
x = $[3];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-ternary.expect.md
+6 -5
View File
@@ -26,7 +26,7 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function useFoo(props) {
const $ = _c(4);
const $ = _c(5);
let x;
if ($[0] !== props.bar) {
x = [];
@@ -36,12 +36,13 @@ function useFoo(props) {
} else {
x = $[1];
}
if ($[2] !== props) {
if ($[2] !== props.cond || $[3] !== props.foo) {
props.cond ? ((x = []), x.push(props.foo)) : null;
$[2] = props;
$[3] = x;
$[2] = props.cond;
$[3] = props.foo;
$[4] = x;
} else {
x = $[3];
x = $[4];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-unconditional-ternary-with-mutation.expect.md
+7 -5
View File
@@ -31,17 +31,19 @@ export const FIXTURE_ENTRYPOINT = {
import { c as _c } from "react/compiler-runtime";
import { arrayPush } from "shared-runtime";
function useFoo(props) {
const $ = _c(2);
const $ = _c(4);
let x;
if ($[0] !== props) {
if ($[0] !== props.bar || $[1] !== props.cond || $[2] !== props.foo) {
x = [];
x.push(props.bar);
props.cond ? ((x = []), x.push(props.foo)) : ((x = []), x.push(props.bar));
arrayPush(x, 4);
$[0] = props;
$[1] = x;
$[0] = props.bar;
$[1] = props.cond;
$[2] = props.foo;
$[3] = x;
} else {
x = $[1];
x = $[3];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-unconditional-ternary.expect.md
+7 -5
View File
@@ -28,7 +28,7 @@ export const FIXTURE_ENTRYPOINT = {
```javascript
import { c as _c } from "react/compiler-runtime";
function useFoo(props) {
const $ = _c(4);
const $ = _c(6);
let x;
if ($[0] !== props.bar) {
x = [];
@@ -38,12 +38,14 @@ function useFoo(props) {
} else {
x = $[1];
}
if ($[2] !== props) {
if ($[2] !== props.cond || $[3] !== props.foo || $[4] !== props.bar) {
props.cond ? ((x = []), x.push(props.foo)) : ((x = []), x.push(props.bar));
$[2] = props;
$[3] = x;
$[2] = props.cond;
$[3] = props.foo;
$[4] = props.bar;
$[5] = x;
} else {
x = $[3];
x = $[5];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-unconditional-with-mutation.expect.md
+7 -5
View File
@@ -39,9 +39,9 @@ import { c as _c } from "react/compiler-runtime";
import { mutate } from "shared-runtime";
function useFoo(props) {
const $ = _c(2);
const $ = _c(4);
let x;
if ($[0] !== props) {
if ($[0] !== props.bar || $[1] !== props.cond || $[2] !== props.foo) {
x = [];
x.push(props.bar);
if (props.cond) {
@@ -53,10 +53,12 @@ function useFoo(props) {
}
mutate(x);
$[0] = props;
$[1] = x;
$[0] = props.bar;
$[1] = props.cond;
$[2] = props.foo;
$[3] = x;
} else {
x = $[1];
x = $[3];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-via-destructuring-with-mutation.expect.md
+7 -5
View File
@@ -35,9 +35,9 @@ import { c as _c } from "react/compiler-runtime";
import { mutate } from "shared-runtime";
function useFoo(props) {
const $ = _c(2);
const $ = _c(4);
let x;
if ($[0] !== props) {
if ($[0] !== props.bar || $[1] !== props.cond || $[2] !== props.foo) {
({ x } = { x: [] });
x.push(props.bar);
if (props.cond) {
@@ -46,10 +46,12 @@ function useFoo(props) {
}
mutate(x);
$[0] = props;
$[1] = x;
$[0] = props.bar;
$[1] = props.cond;
$[2] = props.foo;
$[3] = x;
} else {
x = $[1];
x = $[3];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ssa-renaming-with-mutation.expect.md
+7 -5
View File
@@ -35,9 +35,9 @@ import { c as _c } from "react/compiler-runtime";
import { mutate } from "shared-runtime";
function useFoo(props) {
const $ = _c(2);
const $ = _c(4);
let x;
if ($[0] !== props) {
if ($[0] !== props.bar || $[1] !== props.cond || $[2] !== props.foo) {
x = [];
x.push(props.bar);
if (props.cond) {
@@ -46,10 +46,12 @@ function useFoo(props) {
}
mutate(x);
$[0] = props;
$[1] = x;
$[0] = props.bar;
$[1] = props.cond;
$[2] = props.foo;
$[3] = x;
} else {
x = $[1];
x = $[3];
}
return x;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/switch-non-final-default.expect.md
+16 -15
View File
@@ -33,10 +33,10 @@ function Component(props) {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(7);
const $ = _c(8);
let y;
let t0;
if ($[0] !== props) {
if ($[0] !== props.p0 || $[1] !== props.p2) {
const x = [];
bb0: switch (props.p0) {
case 1: {
@@ -45,11 +45,11 @@ function Component(props) {
case true: {
x.push(props.p2);
let t1;
if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
t1 = [];
$[3] = t1;
$[4] = t1;
} else {
t1 = $[3];
t1 = $[4];
}
y = t1;
}
@@ -62,23 +62,24 @@ function Component(props) {
}
t0 = <Component data={x} />;
$[0] = props;
$[1] = y;
$[2] = t0;
$[0] = props.p0;
$[1] = props.p2;
$[2] = y;
$[3] = t0;
} else {
y = $[1];
t0 = $[2];
y = $[2];
t0 = $[3];
}
const child = t0;
y.push(props.p4);
let t1;
if ($[4] !== y || $[5] !== child) {
if ($[5] !== y || $[6] !== child) {
t1 = <Component data={y}>{child}</Component>;
$[4] = y;
$[5] = child;
$[6] = t1;
$[5] = y;
$[6] = child;
$[7] = t1;
} else {
t1 = $[6];
t1 = $[7];
}
return t1;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/switch.expect.md
+14 -12
View File
@@ -28,10 +28,10 @@ function Component(props) {
```javascript
import { c as _c } from "react/compiler-runtime";
function Component(props) {
const $ = _c(6);
const $ = _c(8);
let y;
let t0;
if ($[0] !== props) {
if ($[0] !== props.p0 || $[1] !== props.p2 || $[2] !== props.p3) {
const x = [];
switch (props.p0) {
case true: {
@@ -44,23 +44,25 @@ function Component(props) {
}
t0 = <Component data={x} />;
$[0] = props;
$[1] = y;
$[2] = t0;
$[0] = props.p0;
$[1] = props.p2;
$[2] = props.p3;
$[3] = y;
$[4] = t0;
} else {
y = $[1];
t0 = $[2];
y = $[3];
t0 = $[4];
}
const child = t0;
y.push(props.p4);
let t1;
if ($[3] !== y || $[4] !== child) {
if ($[5] !== y || $[6] !== child) {
t1 = <Component data={y}>{child}</Component>;
$[3] = y;
$[4] = child;
$[5] = t1;
$[5] = y;
$[6] = child;
$[7] = t1;
} else {
t1 = $[5];
t1 = $[7];
}
return t1;
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/try-catch-mutate-outer-value.expect.md
+12 -4
View File
@@ -28,9 +28,9 @@ import { c as _c } from "react/compiler-runtime";
const { shallowCopy, throwErrorWithMessage } = require("shared-runtime");
function Component(props) {
const $ = _c(3);
const $ = _c(5);
let x;
if ($[0] !== props.a) {
if ($[0] !== props) {
x = [];
try {
let t0;
@@ -42,9 +42,17 @@ function Component(props) {
}
x.push(t0);
} catch {
x.push(shallowCopy({ a: props.a }));
let t0;
if ($[3] !== props.a) {
t0 = shallowCopy({ a: props.a });
$[3] = props.a;
$[4] = t0;
} else {
t0 = $[4];
}
x.push(t0);
}
$[0] = props.a;
$[0] = props;
$[1] = x;
} else {
x = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/try-catch-within-function-expression-returns-caught-value.expect.md
+2 -2
View File
@@ -31,7 +31,7 @@ import { throwInput } from "shared-runtime";
function Component(props) {
const $ = _c(4);
let t0;
if ($[0] !== props.value) {
if ($[0] !== props) {
t0 = () => {
try {
throwInput([props.value]);
@@ -40,7 +40,7 @@ function Component(props) {
return e;
}
};
$[0] = props.value;
$[0] = props;
$[1] = t0;
} else {
t0 = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/try-catch-within-object-method-returns-caught-value.expect.md
+2 -2
View File
@@ -33,7 +33,7 @@ import { throwInput } from "shared-runtime";
function Component(props) {
const $ = _c(2);
let t0;
if ($[0] !== props.value) {
if ($[0] !== props) {
const object = {
foo() {
try {
@@ -46,7 +46,7 @@ function Component(props) {
};
t0 = object.foo();
$[0] = props.value;
$[0] = props;
$[1] = t0;
} else {
t0 = $[1];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useMemo-multiple-if-else.expect.md
+15 -7
View File
@@ -33,11 +33,16 @@ import { c as _c } from "react/compiler-runtime";
import { useMemo } from "react";
function Component(props) {
const $ = _c(3);
const $ = _c(6);
let t0;
bb0: {
let y;
if ($[0] !== props) {
if (
$[0] !== props.cond ||
$[1] !== props.a ||
$[2] !== props.cond2 ||
$[3] !== props.b
) {
y = [];
if (props.cond) {
y.push(props.a);
@@ -48,12 +53,15 @@ function Component(props) {
}
y.push(props.b);
$[0] = props;
$[1] = y;
$[2] = t0;
$[0] = props.cond;
$[1] = props.a;
$[2] = props.cond2;
$[3] = props.b;
$[4] = y;
$[5] = t0;
} else {
y = $[1];
t0 = $[2];
y = $[4];
t0 = $[5];
}
t0 = y;
}