compiler: allow reordering of loadlocal after last assignment

[ghstack-poisoned]

compiler/packages/babel-plugin-react-compiler/src/Optimization/InstructionReordering.ts

@@ -4,6 +4,8 @@ import {
   HIRFunction,
   IdentifierId,
   Instruction,
+  InstructionId,
+  makeInstructionId,
   markInstructionIds,
 } from "../HIR";
 import {
@@ -67,13 +69,41 @@ import { getOrInsertDefault } from "../Utils/utils";
  * - Probably more things.
  */
 export function instructionReordering(fn: HIRFunction): void {
+  const lastReassignments = findLasReassignment(fn);
   const globalDependencies: Dependencies = new Map();
   for (const [, block] of fn.body.blocks) {
-    reorderBlock(fn.env, block, globalDependencies);
+    reorderBlock(fn.env, block, globalDependencies, lastReassignments);
   }
   markInstructionIds(fn.body);
 }
 
+function findLasReassignment(fn: HIRFunction): Reassignments {
+  const lastReassignments: Reassignments = new Map();
+  for (const [, block] of fn.body.blocks) {
+    for (const instr of block.instructions) {
+      for (const lvalue of eachInstructionValueLValue(instr.value)) {
+        if (
+          lvalue.identifier.name !== null &&
+          lvalue.identifier.name.kind === "named"
+        ) {
+          const name = lvalue.identifier.name.value;
+          const previous = lastReassignments.get(name);
+          if (previous !== undefined) {
+            lastReassignments.set(
+              name,
+              makeInstructionId(Math.max(previous, instr.id))
+            );
+          } else {
+            lastReassignments.set(name, instr.id);
+          }
+        }
+      }
+    }
+  }
+  return lastReassignments;
+}
+
+type Reassignments = Map<string, InstructionId>;
 type Dependencies = Map<IdentifierId, Node>;
 type Node = {
   instruction: Instruction | null;
@@ -81,10 +111,17 @@ type Node = {
   depth: number | null;
 };
 
+enum ReorderingLevel {
+  None = "none",
+  Local = "local",
+  Global = "global",
+}
+
 function reorderBlock(
   env: Environment,
   block: BasicBlock,
-  globalDependencies: Dependencies
+  globalDependencies: Dependencies,
+  lastReassignments: Reassignments
 ): void {
   const dependencies: Dependencies = new Map();
   const locals = new Map<string, IdentifierId>();
@@ -99,7 +136,7 @@ function reorderBlock(
         depth: null,
       }
     );
-    if (getReorderingLevel(instr) === ReorderingLevel.None) {
+    if (getReorderingLevel(instr, lastReassignments) === ReorderingLevel.None) {
       if (previousIdentifier !== null) {
         node.dependencies.push(previousIdentifier);
       }
@@ -206,7 +243,8 @@ function reorderBlock(
     }
     if (
       node.instruction !== null &&
-      getReorderingLevel(node.instruction) === ReorderingLevel.Global &&
+      getReorderingLevel(node.instruction, lastReassignments) ===
+        ReorderingLevel.Global &&
       (block.kind === "block" || block.kind === "catch")
     ) {
       globalDependencies.set(id, node);
@@ -221,12 +259,10 @@ function reorderBlock(
   block.instructions = instructions;
 }
 
-enum ReorderingLevel {
-  None = "none",
-  Local = "local",
-  Global = "global",
-}
-function getReorderingLevel(instr: Instruction): ReorderingLevel {
+function getReorderingLevel(
+  instr: Instruction,
+  lastReassignments: Reassignments
+): ReorderingLevel {
   switch (instr.value.kind) {
     case "JsxExpression":
     case "JsxFragment":
@@ -236,21 +272,19 @@ function getReorderingLevel(instr: Instruction): ReorderingLevel {
     case "TemplateLiteral": {
       return ReorderingLevel.Global;
     }
-    /*
-     * For locals, a simple and robust strategy is to figure out the range of instructions where the identifier may be reassigned,
-     * and then allow reordering of LoadLocal instructions which occur after this range. Obviously for const, this means that all
-     * LoadLocals can be reordered, so a simpler thing to start with is just to only allow reordering of loads of known-consts.
-     *
-     * With this overall strategy we can allow global reordering of LoadLocals and remove the global/local reordering distinction
-     * (all reordering can be global).
-     *
-     * case "Destructure":
-     * case "StoreLocal":
-     * case "LoadLocal":
-     * {
-     *   return ReorderingLevel.Local;
-     * }
-     */
+    case "LoadLocal": {
+      if (
+        instr.value.place.identifier.name !== null &&
+        instr.value.place.identifier.name.kind === "named"
+      ) {
+        const name = instr.value.place.identifier.name.value;
+        const lastAssignment = lastReassignments.get(name);
+        if (lastAssignment !== undefined && lastAssignment < instr.id) {
+          return ReorderingLevel.Global;
+        }
+      }
+      return ReorderingLevel.None;
+    }
     default: {
       return ReorderingLevel.None;
     }

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/alias-computed-load.expect.md

@@ -19,19 +19,20 @@ function component(a) {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let x;
+  let t0;
   if ($[0] !== a) {
-    x = { a };
-    const y = {};
+    const x = { a };
 
+    t0 = x;
+    const y = {};
     y.x = x.a;
     mutate(y);
     $[0] = a;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/alias-nested-member-path-mutate.expect.md

@@ -20,19 +20,21 @@ function component() {
 import { c as _c } from "react/compiler-runtime";
 function component() {
   const $ = _c(1);
-  let x;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     const z = [];
     const y = {};
     y.z = z;
-    x = {};
+    const x = {};
+
+    t0 = x;
     x.y = y;
     mutate(x.y.z);
-    $[0] = x;
+    $[0] = t0;
   } else {
-    x = $[0];
+    t0 = $[0];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/alias-nested-member-path.expect.md

@@ -25,18 +25,20 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function component() {
   const $ = _c(1);
-  let x;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     const z = [];
     const y = {};
     y.z = z;
-    x = {};
+    const x = {};
+
+    t0 = x;
     x.y = y;
-    $[0] = x;
+    $[0] = t0;
   } else {
-    x = $[0];
+    t0 = $[0];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-at-mutate-after-capture.expect.md

@@ -22,18 +22,20 @@ import { c as _c } from "react/compiler-runtime"; // x's mutable range should ex
 
 function Component(props) {
   const $ = _c(2);
-  let x;
+  let t0;
   if ($[0] !== props.b) {
-    x = [42, {}];
+    const x = [42, {}];
+
+    t0 = x;
     const idx = foo(props.b);
     const y = x.at(idx);
     mutate(y);
     $[0] = props.b;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-push-effect.expect.md

@@ -42,25 +42,27 @@ function Component(props) {
     t1 = $[3];
   }
   const y = t1;
-  let arr;
+  let t2;
   if ($[4] !== x || $[5] !== y) {
-    arr = [];
-    let t2;
+    const arr = [];
+
+    t2 = arr;
+    let t3;
     if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
-      t2 = {};
-      $[7] = t2;
+      t3 = {};
+      $[7] = t3;
     } else {
-      t2 = $[7];
+      t3 = $[7];
     }
-    arr.push(t2);
+    arr.push(t3);
     arr.push(x, y);
     $[4] = x;
     $[5] = y;
-    $[6] = arr;
+    $[6] = t2;
   } else {
-    arr = $[6];
+    t2 = $[6];
   }
-  return arr;
+  return t2;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/assignment-expression-computed.expect.md

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

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/assignment-expression-nested-path.expect.md

@@ -23,17 +23,19 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function g(props) {
   const $ = _c(2);
-  let a;
+  let t0;
   if ($[0] !== props.c) {
-    a = { b: { c: props.c } };
+    const a = { b: { c: props.c } };
+
+    t0 = a;
     a.b.c = a.b.c + 1;
     a.b.c = a.b.c * 2;
     $[0] = props.c;
-    $[1] = a;
+    $[1] = t0;
   } else {
-    a = $[1];
+    t0 = $[1];
   }
-  return a;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/assignment-variations-complex-lvalue-array.expect.md

@@ -23,16 +23,18 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function foo() {
   const $ = _c(1);
-  let a;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    a = [[1]];
+    const a = [[1]];
+
+    t0 = a;
     const first = a.at(0);
     first.set(0, 2);
-    $[0] = a;
+    $[0] = t0;
   } else {
-    a = $[0];
+    t0 = $[0];
   }
-  return a;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/assignment-variations-complex-lvalue.expect.md

@@ -23,16 +23,18 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function g() {
   const $ = _c(1);
-  let x;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    x = { y: { z: 1 } };
+    const x = { y: { z: 1 } };
+
+    t0 = x;
     x.y.z = x.y.z + 1;
     x.y.z = x.y.z * 2;
-    $[0] = x;
+    $[0] = t0;
   } else {
-    x = $[0];
+    t0 = $[0];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/await-side-effecting-promise.expect.md

@@ -16,16 +16,18 @@ async function Component(props) {
 import { c as _c } from "react/compiler-runtime";
 async function Component(props) {
   const $ = _c(2);
-  let x;
+  let t0;
   if ($[0] !== props.id) {
-    x = [];
+    const x = [];
+
+    t0 = x;
     await populateData(props.id, x);
     $[0] = props.id;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/call-args-assignment.expect.md

@@ -16,15 +16,17 @@ function Component(props) {
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
   const $ = _c(1);
-  let x;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    x = makeObject();
+    let x = makeObject();
+
+    t0 = x;
     x.foo((x = makeObject()));
-    $[0] = x;
+    $[0] = t0;
   } else {
-    x = $[0];
+    t0 = $[0];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/call-args-destructuring-assignment.expect.md

@@ -16,15 +16,17 @@ function Component(props) {
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
   const $ = _c(1);
-  let x;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    x = makeObject();
+    let x = makeObject();
+
+    t0 = x;
     x.foo(([x] = makeObject()));
-    $[0] = x;
+    $[0] = t0;
   } else {
-    x = $[0];
+    t0 = $[0];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/call.expect.md

@@ -27,10 +27,10 @@ function Component(props) {
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     const a = [];
     const b = {};
-    foo(a, b);
 
-    foo(b);
     t0 = <div a={a} b={b} />;
+    foo(a, b);
+    foo(b);
     $[0] = t0;
   } else {
     t0 = $[0];

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capture-indirect-mutate-alias.expect.md

@@ -30,25 +30,25 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let x;
+  let t0;
   if ($[0] !== a) {
-    x = { a };
+    const x = { a };
+
+    t0 = x;
     const f0 = function () {
       const q = x;
       const f1 = function () {
         q.b = 1;
       };
-
       f1();
     };
-
     f0();
     $[0] = a;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capture_mutate-across-fns.expect.md

@@ -28,24 +28,24 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let z;
+  let t0;
   if ($[0] !== a) {
-    z = { a };
+    const z = { a };
+
+    t0 = z;
     const f0 = function () {
       const f1 = function () {
         z.b = 1;
       };
-
       f1();
     };
-
     f0();
     $[0] = a;
-    $[1] = z;
+    $[1] = t0;
   } else {
-    z = $[1];
+    t0 = $[1];
   }
-  return z;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-fun-alias-captured-mutate-2-iife.expect.md

@@ -31,23 +31,24 @@ import { mutate } from "shared-runtime";
 
 function component(foo, bar) {
   const $ = _c(3);
-  let x;
+  let t0;
   if ($[0] !== foo || $[1] !== bar) {
-    x = { foo };
+    const x = { foo };
     const y = { bar };
 
     const a = { y };
     const b = x;
     a.x = b;
 
+    t0 = x;
     mutate(y);
     $[0] = foo;
     $[1] = bar;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-fun-alias-captured-mutate-2.expect.md

@@ -23,25 +23,26 @@ function component(foo, bar) {
 import { c as _c } from "react/compiler-runtime";
 function component(foo, bar) {
   const $ = _c(3);
-  let x;
+  let t0;
   if ($[0] !== foo || $[1] !== bar) {
-    x = { foo };
+    const x = { foo };
+
+    t0 = x;
     const y = { bar };
     const f0 = function () {
       const a = { y };
       const b = x;
       a.x = b;
     };
-
     f0();
     mutate(y);
     $[0] = foo;
     $[1] = bar;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-fun-alias-captured-mutate-arr-2-iife.expect.md

@@ -31,23 +31,24 @@ const { mutate } = require("shared-runtime");
 
 function component(foo, bar) {
   const $ = _c(3);
-  let x;
+  let t0;
   if ($[0] !== foo || $[1] !== bar) {
-    x = { foo };
+    const x = { foo };
     const y = { bar };
 
     const a = [y];
     const b = x;
     a.x = b;
 
+    t0 = x;
     mutate(y);
     $[0] = foo;
     $[1] = bar;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-fun-alias-captured-mutate-arr-2.expect.md

@@ -23,25 +23,26 @@ function component(foo, bar) {
 import { c as _c } from "react/compiler-runtime";
 function component(foo, bar) {
   const $ = _c(3);
-  let x;
+  let t0;
   if ($[0] !== foo || $[1] !== bar) {
-    x = { foo };
+    const x = { foo };
+
+    t0 = x;
     const y = { bar };
     const f0 = function () {
       const a = [y];
       const b = x;
       a.x = b;
     };
-
     f0();
     mutate(y);
     $[0] = foo;
     $[1] = bar;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-captured-mutate-arr-iife.expect.md

@@ -31,23 +31,24 @@ const { mutate } = require("shared-runtime");
 
 function component(foo, bar) {
   const $ = _c(3);
-  let y;
+  let t0;
   if ($[0] !== foo || $[1] !== bar) {
     const x = { foo };
-    y = { bar };
+    const y = { bar };
 
     const a = [y];
     const b = x;
     a.x = b;
 
+    t0 = y;
     mutate(y);
     $[0] = foo;
     $[1] = bar;
-    $[2] = y;
+    $[2] = t0;
   } else {
-    y = $[2];
+    t0 = $[2];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-captured-mutate-arr.expect.md

@@ -23,25 +23,26 @@ function component(foo, bar) {
 import { c as _c } from "react/compiler-runtime";
 function component(foo, bar) {
   const $ = _c(3);
-  let y;
+  let t0;
   if ($[0] !== foo || $[1] !== bar) {
     const x = { foo };
-    y = { bar };
+    const y = { bar };
+
+    t0 = y;
     const f0 = function () {
       const a = [y];
       const b = x;
       a.x = b;
     };
-
     f0();
     mutate(y);
     $[0] = foo;
     $[1] = bar;
-    $[2] = y;
+    $[2] = t0;
   } else {
-    y = $[2];
+    t0 = $[2];
   }
-  return y;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-captured-mutate-iife.expect.md

@@ -31,23 +31,24 @@ const { mutate } = require("shared-runtime");
 
 function component(foo, bar) {
   const $ = _c(3);
-  let y;
+  let t0;
   if ($[0] !== foo || $[1] !== bar) {
     const x = { foo };
-    y = { bar };
+    const y = { bar };
 
     const a = { y };
     const b = x;
     a.x = b;
 
+    t0 = y;
     mutate(y);
     $[0] = foo;
     $[1] = bar;
-    $[2] = y;
+    $[2] = t0;
   } else {
-    y = $[2];
+    t0 = $[2];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-captured-mutate.expect.md

@@ -23,25 +23,26 @@ function component(foo, bar) {
 import { c as _c } from "react/compiler-runtime";
 function component(foo, bar) {
   const $ = _c(3);
-  let y;
+  let t0;
   if ($[0] !== foo || $[1] !== bar) {
     const x = { foo };
-    y = { bar };
+    const y = { bar };
+
+    t0 = y;
     const f0 = function () {
       const a = { y };
       const b = x;
       a.x = b;
     };
-
     f0();
     mutate(y);
     $[0] = foo;
     $[1] = bar;
-    $[2] = y;
+    $[2] = t0;
   } else {
-    y = $[2];
+    t0 = $[2];
   }
-  return y;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-computed-mutate-iife.expect.md

@@ -29,20 +29,21 @@ const { mutate } = require("shared-runtime");
 
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
     const x = { a };
-    y = {};
+    const y = {};
 
     y.x = x;
 
+    t0 = y;
     mutate(y);
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-computed-mutate.expect.md

@@ -21,22 +21,23 @@ function component(a) {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
     const x = { a };
-    y = {};
+    const y = {};
+
+    t0 = y;
     const f0 = function () {
       y.x = x;
     };
-
     f0();
     mutate(y);
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-mutate-iife.expect.md

@@ -29,20 +29,21 @@ const { mutate } = require("shared-runtime");
 
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
     const x = { a };
-    y = {};
+    const y = {};
 
     y.x = x;
 
+    t0 = y;
     mutate(y);
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-mutate.expect.md

@@ -21,22 +21,23 @@ function component(a) {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
     const x = { a };
-    y = {};
+    const y = {};
+
+    t0 = y;
     const f0 = function () {
       y.x = x;
     };
-
     f0();
     mutate(y);
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-receiver-computed-mutate-iife.expect.md

@@ -30,21 +30,22 @@ import { mutate } from "shared-runtime";
 
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
     const x = { a };
-    y = {};
+    const y = {};
 
     const a_0 = y;
     a_0.x = x;
 
+    t0 = y;
     mutate(y);
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-receiver-computed-mutate.expect.md

@@ -22,23 +22,24 @@ function component(a) {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
     const x = { a };
-    y = {};
+    const y = {};
+
+    t0 = y;
     const f0 = function () {
       const a_0 = y;
       a_0.x = x;
     };
-
     f0();
     mutate(y);
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-receiver-mutate-iife.expect.md

@@ -30,21 +30,22 @@ const { mutate } = require("shared-runtime");
 
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
     const x = { a };
-    y = {};
+    const y = {};
 
     const a_0 = y;
     a_0.x = x;
 
+    t0 = y;
     mutate(y);
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-alias-receiver-mutate.expect.md

@@ -22,23 +22,24 @@ function component(a) {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
     const x = { a };
-    y = {};
+    const y = {};
+
+    t0 = y;
     const f0 = function () {
       const a_0 = y;
       a_0.x = x;
     };
-
     f0();
     mutate(y);
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-mutate-2.expect.md

@@ -36,21 +36,22 @@ function component(a, b) {
     t0 = $[1];
   }
   const y = t0;
-  let z;
+  let t1;
   if ($[2] !== a || $[3] !== y.b) {
-    z = { a };
+    const z = { a };
+
+    t1 = z;
     const x = function () {
       z.a = 2;
     };
-
     x();
     $[2] = a;
     $[3] = y.b;
-    $[4] = z;
+    $[4] = t1;
   } else {
-    z = $[4];
+    t1 = $[4];
   }
-  return z;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-mutate-nested.expect.md

@@ -25,20 +25,21 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== a) {
-    y = { b: { a } };
+    const y = { b: { a } };
+
+    t0 = y;
     const x = function () {
       y.b.a = 2;
     };
-
     x();
     $[0] = a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-func-mutate.expect.md

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

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/capturing-function-decl.expect.md

@@ -25,20 +25,21 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(2);
-  let t;
+  let t0;
   if ($[0] !== a) {
-    t = { a };
+    const t = { a };
+
+    t0 = t;
     const x = function x() {
       t.foo();
     };
-
     x(t);
     $[0] = a;
-    $[1] = t;
+    $[1] = t0;
   } else {
-    t = $[1];
+    t0 = $[1];
   }
-  return t;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/chained-assignment-expressions.expect.md

@@ -25,18 +25,20 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function foo() {
   const $ = _c(1);
-  let z;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     const x = { x: 0 };
     const y = { z: 0 };
-    z = { z: 0 };
+    const z = { z: 0 };
+
+    t0 = z;
     x.x = x.x + (y.y = y.y * 1);
     z.z = z.z + (y.y = y.y * (x.x = x.x & 3));
-    $[0] = z;
+    $[0] = t0;
   } else {
-    z = $[0];
+    t0 = $[0];
   }
-  return z;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/codegen-emit-make-read-only.expect.md

@@ -24,21 +24,23 @@ import { c as _c } from "react/compiler-runtime"; // @enableEmitFreeze true
 
 function MyComponentName(props) {
   const $ = _c(3);
-  let y;
+  let t0;
   if ($[0] !== props.a || $[1] !== props.b) {
     const x = {};
     foo(x, props.a);
     foo(x, props.b);
 
-    y = [];
+    const y = [];
+
+    t0 = y;
     y.push(x);
     $[0] = props.a;
     $[1] = props.b;
-    $[2] = __DEV__ ? makeReadOnly(y, "MyComponentName") : y;
+    $[2] = __DEV__ ? makeReadOnly(t0, "MyComponentName") : t0;
   } else {
-    y = $[2];
+    t0 = $[2];
   }
-  return y;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/computed-call-evaluation-order.expect.md

@@ -41,18 +41,19 @@ function Component() {
     t0 = $[0];
   }
   const changeF = t0;
-  let x;
+  let t1;
   if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-    x = { f: () => console.log("original") };
+    const x = { f: () => console.log("original") };
 
+    t1 = x;
     (console.log("A"), x)[(console.log("B"), "f")](
       (changeF(x), console.log("arg"), 1),
     );
-    $[1] = x;
+    $[1] = t1;
   } else {
-    x = $[1];
+    t1 = $[1];
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/computed-store-alias.expect.md

@@ -18,19 +18,21 @@ function component(a, b) {
 import { c as _c } from "react/compiler-runtime";
 function component(a, b) {
   const $ = _c(3);
-  let x;
+  let t0;
   if ($[0] !== a || $[1] !== b) {
     const y = { a };
-    x = { b };
+    const x = { b };
+
+    t0 = x;
     x.y = y;
     mutate(x);
     $[0] = a;
     $[1] = b;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/conditional-break-labeled.expect.md

@@ -34,9 +34,9 @@ import { c as _c } from "react/compiler-runtime"; /**
  */
 function Component(props) {
   const $ = _c(2);
-  let a;
+  let t0;
   if ($[0] !== props) {
-    a = [];
+    const a = [];
     a.push(props.a);
     bb0: {
       if (props.b) {
@@ -46,13 +46,14 @@ function Component(props) {
       a.push(props.c);
     }
 
+    t0 = a;
     a.push(props.d);
     $[0] = props;
-    $[1] = a;
+    $[1] = t0;
   } else {
-    a = $[1];
+    t0 = $[1];
   }
-  return a;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/conditional-early-return.expect.md

@@ -71,31 +71,32 @@ import { c as _c } from "react/compiler-runtime"; /**
  */
 function ComponentA(props) {
   const $ = _c(3);
-  let a_DEBUG;
   let t0;
+  let t1;
   if ($[0] !== props) {
-    t0 = Symbol.for("react.early_return_sentinel");
+    t1 = Symbol.for("react.early_return_sentinel");
     bb0: {
-      a_DEBUG = [];
+      const a_DEBUG = [];
       a_DEBUG.push(props.a);
       if (props.b) {
-        t0 = null;
+        t1 = null;
         break bb0;
       }
 
+      t0 = a_DEBUG;
       a_DEBUG.push(props.d);
     }
     $[0] = props;
-    $[1] = a_DEBUG;
-    $[2] = t0;
+    $[1] = t0;
+    $[2] = t1;
   } else {
-    a_DEBUG = $[1];
-    t0 = $[2];
+    t0 = $[1];
+    t1 = $[2];
   }
-  if (t0 !== Symbol.for("react.early_return_sentinel")) {
-    return t0;
+  if (t1 !== Symbol.for("react.early_return_sentinel")) {
+    return t1;
   }
-  return a_DEBUG;
+  return t0;
 }
 
 /**
@@ -103,21 +104,22 @@ function ComponentA(props) {
  */
 function ComponentB(props) {
   const $ = _c(2);
-  let a;
+  let t0;
   if ($[0] !== props) {
-    a = [];
+    const a = [];
     a.push(props.a);
     if (props.b) {
       a.push(props.c);
     }
 
+    t0 = a;
     a.push(props.d);
     $[0] = props;
-    $[1] = a;
+    $[1] = t0;
   } else {
-    a = $[1];
+    t0 = $[1];
   }
-  return a;
+  return t0;
 }
 
 /**
@@ -125,32 +127,33 @@ function ComponentB(props) {
  */
 function ComponentC(props) {
   const $ = _c(3);
-  let a;
   let t0;
+  let t1;
   if ($[0] !== props) {
-    t0 = Symbol.for("react.early_return_sentinel");
+    t1 = Symbol.for("react.early_return_sentinel");
     bb0: {
-      a = [];
+      const a = [];
       a.push(props.a);
       if (props.b) {
         a.push(props.c);
-        t0 = null;
+        t1 = null;
         break bb0;
       }
 
+      t0 = a;
       a.push(props.d);
     }
     $[0] = props;
-    $[1] = a;
-    $[2] = t0;
+    $[1] = t0;
+    $[2] = t1;
   } else {
-    a = $[1];
-    t0 = $[2];
+    t0 = $[1];
+    t1 = $[2];
   }
-  if (t0 !== Symbol.for("react.early_return_sentinel")) {
-    return t0;
+  if (t1 !== Symbol.for("react.early_return_sentinel")) {
+    return t1;
   }
-  return a;
+  return t0;
 }
 
 /**
@@ -158,32 +161,33 @@ function ComponentC(props) {
  */
 function ComponentD(props) {
   const $ = _c(3);
-  let a;
   let t0;
+  let t1;
   if ($[0] !== props) {
-    t0 = Symbol.for("react.early_return_sentinel");
+    t1 = Symbol.for("react.early_return_sentinel");
     bb0: {
-      a = [];
+      const a = [];
       a.push(props.a);
       if (props.b) {
         a.push(props.c);
-        t0 = a;
+        t1 = a;
         break bb0;
       }
 
+      t0 = a;
       a.push(props.d);
     }
     $[0] = props;
-    $[1] = a;
-    $[2] = t0;
+    $[1] = t0;
+    $[2] = t1;
   } else {
-    a = $[1];
-    t0 = $[2];
+    t0 = $[1];
+    t1 = $[2];
   }
-  if (t0 !== Symbol.for("react.early_return_sentinel")) {
-    return t0;
+  if (t1 !== Symbol.for("react.early_return_sentinel")) {
+    return t1;
   }
-  return a;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/constant-computed.expect.md

@@ -24,17 +24,19 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
   const $ = _c(2);
-  let x;
+  let t0;
   if ($[0] !== props.foo) {
-    x = {};
+    const x = {};
+
+    t0 = x;
     x.foo = x.foo + x.bar;
     x.foo(props.foo);
     $[0] = props.foo;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/constructor.expect.md

@@ -27,9 +27,10 @@ function Component(props) {
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     const a = [];
     const b = {};
+
+    t0 = <div a={a} b={b} />;
     new Foo(a, b);
     new Foo(b);
-    t0 = <div a={a} b={b} />;
     $[0] = t0;
   } else {
     t0 = $[0];

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/context-variable-reassigned-outside-of-lambda.expect.md

@@ -28,20 +28,19 @@ import { Stringify } from "shared-runtime";
 
 function Component(props) {
   const $ = _c(1);
+  let x;
+  x = null;
+  const callback = () => {
+    console.log(x);
+  };
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    let x;
-    x = null;
-    const callback = () => {
-      console.log(x);
-    };
-
-    x = {};
     t0 = <Stringify callback={callback} shouldInvokeFns={true} />;
     $[0] = t0;
   } else {
     t0 = $[0];
   }
+  x = {};
   return t0;
 }
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/debugger-memoized.expect.md

@@ -23,18 +23,19 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
   const $ = _c(2);
-  let x;
+  let t0;
   if ($[0] !== props.value) {
-    x = [];
-    debugger;
+    const x = [];
 
+    t0 = x;
+    debugger;
     x.push(props.value);
     $[0] = props.value;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/delete-computed-property.expect.md

@@ -23,17 +23,19 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
   const $ = _c(3);
-  let x;
+  let t0;
   if ($[0] !== props.a || $[1] !== props.b) {
-    x = { a: props.a, b: props.b };
+    const x = { a: props.a, b: props.b };
+
+    t0 = x;
     delete x["b"];
     $[0] = props.a;
     $[1] = props.b;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/delete-property.expect.md

@@ -22,17 +22,19 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
   const $ = _c(3);
-  let x;
+  let t0;
   if ($[0] !== props.a || $[1] !== props.b) {
-    x = { a: props.a, b: props.b };
+    const x = { a: props.a, b: props.b };
+
+    t0 = x;
     delete x.b;
     $[0] = props.a;
     $[1] = props.b;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.expect.md

@@ -105,8 +105,8 @@ function Component(props) {
     }
     const onClick = t7;
 
-    allUrls.push(...urls);
     t1 = <Stringify media={media} allUrls={allUrls} onClick={onClick} />;
+    allUrls.push(...urls);
     $[1] = post;
     $[2] = t1;
   } else {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.expect.md

@@ -30,37 +30,37 @@ function Component(props) {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
-  const $ = _c(4);
+  const $ = _c(5);
   const post = useFragment(graphql`...`, props.post);
+  const allUrls = [];
+
+  const { media, comments, urls } = post;
   let t0;
-  if ($[0] !== post) {
-    const allUrls = [];
+  if ($[0] !== comments.length) {
+    t0 = (e) => {
+      if (!comments.length) {
+        return;
+      }
 
-    const { media, comments, urls } = post;
-    let t1;
-    if ($[2] !== comments.length) {
-      t1 = (e) => {
-        if (!comments.length) {
-          return;
-        }
-
-        console.log(comments.length);
-      };
-      $[2] = comments.length;
-      $[3] = t1;
-    } else {
-      t1 = $[3];
-    }
-    const onClick = t1;
-
-    allUrls.push(...urls);
-    t0 = <Media media={media} onClick={onClick} />;
-    $[0] = post;
+      console.log(comments.length);
+    };
+    $[0] = comments.length;
     $[1] = t0;
   } else {
     t0 = $[1];
   }
-  return t0;
+  const onClick = t0;
+  let t1;
+  if ($[2] !== media || $[3] !== onClick) {
+    t1 = <Media media={media} onClick={onClick} />;
+    $[2] = media;
+    $[3] = onClick;
+    $[4] = t1;
+  } else {
+    t1 = $[4];
+  }
+  allUrls.push(...urls);
+  return t1;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/do-while-early-unconditional-break.expect.md

@@ -19,16 +19,17 @@ function Component(props) {
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
   const $ = _c(1);
-  let x;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    x = [1, 2, 3];
+    const x = [1, 2, 3];
 
+    t0 = x;
     mutate(x);
-    $[0] = x;
+    $[0] = t0;
   } else {
-    x = $[0];
+    t0 = $[0];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/dont-merge-overlapping-scopes-store-const-used-later.expect.md

@@ -46,7 +46,6 @@ function Component(props) {
     t1 = $[3];
   }
   const element = t1;
-  console.log(x);
   let t2;
   if ($[4] !== element) {
     t2 = <div>{element}</div>;
@@ -55,6 +54,7 @@ function Component(props) {
   } else {
     t2 = $[5];
   }
+  console.log(x);
   return t2;
 }
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-iife-return-modified-later-logical.expect.md

@@ -23,7 +23,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Error
 
 ```
-Invariant: Invalid nesting in program blocks or scopes. Items overlap but are not nested: 2:15(3:21)
+Invariant: Invalid nesting in program blocks or scopes. Items overlap but are not nested: 2:15(3:22)
 ```
           
       

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-reactive-scope-overlaps-label.expect.md

@@ -34,7 +34,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Error
 
 ```
-Invariant: Invalid nesting in program blocks or scopes. Items overlap but are not nested: 3:14(4:18)
+Invariant: Invalid nesting in program blocks or scopes. Items overlap but are not nested: 3:14(5:19)
 ```
           
       

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-reactive-scope-overlaps-try.expect.md

@@ -30,7 +30,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Error
 
 ```
-Invariant: Invalid nesting in program blocks or scopes. Items overlap but are not nested: 3:17(4:20)
+Invariant: Invalid nesting in program blocks or scopes. Items overlap but are not nested: 3:17(4:21)
 ```
           
       

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/escape-analysis-jsx-child.expect.md

@@ -27,30 +27,24 @@ export const FIXTURE_ENTRYPOINT = {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function foo(a, b, c) {
-  const $ = _c(9);
+  const $ = _c(7);
   let x;
   if ($[0] !== a || $[1] !== b || $[2] !== c) {
     x = [];
     if (a) {
-      let y;
+      let t0;
       if ($[4] !== b || $[5] !== c) {
-        y = [];
+        const y = [];
         if (b) {
           y.push(c);
         }
+
+        t0 = <div>{y}</div>;
         $[4] = b;
         $[5] = c;
-        $[6] = y;
+        $[6] = t0;
       } else {
-        y = $[6];
-      }
-      let t0;
-      if ($[7] !== y) {
-        t0 = <div>{y}</div>;
-        $[7] = y;
-        $[8] = t0;
-      } else {
-        t0 = $[8];
+        t0 = $[6];
       }
       x.push(t0);
     }

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

@@ -41,19 +41,21 @@ function Component(props) {
     t0 = $[1];
   }
   const a = t0;
-  let b;
+  let t1;
   if ($[2] !== a || $[3] !== props.b) {
-    b = [];
+    const b = [];
+
+    t1 = b;
     const c = {};
     c.a = a;
     b.push(props.b);
     $[2] = a;
     $[3] = props.b;
-    $[4] = b;
+    $[4] = t1;
   } else {
-    b = $[4];
+    t1 = $[4];
   }
-  return b;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

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

@@ -59,19 +59,21 @@ function Component(props) {
     t1 = $[3];
   }
   const b = t1;
-  let c;
+  let t2;
   if ($[4] !== b || $[5] !== props.b) {
-    c = [];
+    const c = [];
+
+    t2 = c;
     const d = {};
     d.b = b;
     c.push(props.b);
     $[4] = b;
     $[5] = props.b;
-    $[6] = c;
+    $[6] = t2;
   } else {
-    c = $[6];
+    t2 = $[6];
   }
-  return c;
+  return t2;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/escape-analysis-non-escaping-interleaved-primitive-dependency.expect.md

@@ -36,19 +36,21 @@ function Component(props) {
   const $ = _c(3);
 
   const a = props.a + props.b;
-  let b;
+  let t0;
   if ($[0] !== a || $[1] !== props.c) {
-    b = [];
+    const b = [];
+
+    t0 = b;
     const c = {};
     c.a = a;
     b.push(props.c);
     $[0] = a;
     $[1] = props.c;
-    $[2] = b;
+    $[2] = t0;
   } else {
-    b = $[2];
+    t0 = $[2];
   }
-  return b;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/function-declaration-simple.expect.md

@@ -25,27 +25,28 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function component(a) {
   const $ = _c(3);
-  let t;
+  let t0;
   if ($[0] !== a) {
-    t = { a };
-    let t0;
+    const t = { a };
+
+    t0 = t;
+    let t1;
     if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-      t0 = function x(p) {
+      t1 = function x(p) {
         p.foo();
       };
-      $[2] = t0;
+      $[2] = t1;
     } else {
-      t0 = $[2];
+      t1 = $[2];
     }
-    const x = t0;
-
+    const x = t1;
     x(t);
     $[0] = a;
-    $[1] = t;
+    $[1] = t0;
   } else {
-    t = $[1];
+    t0 = $[1];
   }
-  return t;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/function-expression-with-store-to-parameter.expect.md

@@ -31,16 +31,18 @@ function Component(props) {
     t0 = $[0];
   }
   const mutate = t0;
-  let x;
+  let t1;
   if ($[1] !== props) {
-    x = makeObject(props);
+    const x = makeObject(props);
+
+    t1 = x;
     mutate(x);
     $[1] = props;
-    $[2] = x;
+    $[2] = t1;
   } else {
-    x = $[2];
+    t1 = $[2];
   }
-  return x;
+  return t1;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hoisting-computed-member-expression.expect.md

@@ -34,19 +34,15 @@ import { Stringify } from "shared-runtime";
 
 function hoisting() {
   const $ = _c(1);
+  const onClick = function onClick() {
+    return bar.baz;
+  };
+
+  const onClick2 = function onClick2() {
+    return bar[baz];
+  };
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    const onClick = function onClick() {
-      return bar.baz;
-    };
-
-    const onClick2 = function onClick2() {
-      return bar[baz];
-    };
-
-    const baz = "baz";
-    const bar = { baz: 1 };
-
     t0 = (
       <Stringify onClick={onClick} onClick2={onClick2} shouldInvokeFns={true} />
     );
@@ -54,6 +50,8 @@ function hoisting() {
   } else {
     t0 = $[0];
   }
+  const baz = "baz";
+  const bar = { baz: 1 };
   return t0;
 }
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hoisting-member-expression.expect.md

@@ -29,19 +29,17 @@ import { Stringify } from "shared-runtime";
 
 function hoisting() {
   const $ = _c(1);
+  const onClick = function onClick(x) {
+    return x + bar.baz;
+  };
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    const onClick = function onClick(x) {
-      return x + bar.baz;
-    };
-
-    const bar = { baz: 1 };
-
     t0 = <Stringify onClick={onClick} />;
     $[0] = t0;
   } else {
     t0 = $[0];
   }
+  const bar = { baz: 1 };
   return t0;
 }
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-call.expect.md

@@ -37,7 +37,6 @@ function Component(props) {
   }
   const x = t0;
   const y = useFreeze(x);
-  foo(y, x);
   let t1;
   if ($[1] !== y) {
     t1 = (
@@ -51,6 +50,7 @@ function Component(props) {
   } else {
     t1 = $[2];
   }
+  foo(y, x);
   return t1;
 }
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/iife-return-modified-later.expect.md

@@ -24,20 +24,21 @@ import { c as _c } from "react/compiler-runtime";
 function Component(props) {
   const $ = _c(3);
   let t0;
-  let items;
+  let t1;
   if ($[0] !== props.a) {
     t0 = [];
-    items = t0;
+    const items = t0;
 
+    t1 = items;
     items.push(props.a);
     $[0] = props.a;
-    $[1] = items;
+    $[1] = t1;
     $[2] = t0;
   } else {
-    items = $[1];
+    t1 = $[1];
     t0 = $[2];
   }
-  return items;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/inadvertent-mutability-readonly-lambda.expect.md

@@ -35,15 +35,17 @@ function Component(props) {
   const onChange = t0;
 
   useOtherHook();
-  let x;
+  let t1;
   if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-    x = {};
+    const x = {};
+
+    t1 = x;
     foo(x, onChange);
-    $[1] = x;
+    $[1] = t1;
   } else {
-    x = $[1];
+    t1 = $[1];
   }
-  return x;
+  return t1;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/independently-memoize-object-property.expect.md

@@ -24,27 +24,29 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function foo(a, b, c) {
   const $ = _c(7);
-  let x;
+  let t0;
   if ($[0] !== a || $[1] !== b || $[2] !== c) {
-    x = { a };
-    let t0;
+    const x = { a };
+
+    t0 = x;
+    let t1;
     if ($[4] !== b || $[5] !== c) {
-      t0 = [b, c];
+      t1 = [b, c];
       $[4] = b;
       $[5] = c;
-      $[6] = t0;
+      $[6] = t1;
     } else {
-      t0 = $[6];
+      t1 = $[6];
     }
-    x.y = t0;
+    x.y = t1;
     $[0] = a;
     $[1] = b;
     $[2] = c;
-    $[3] = x;
+    $[3] = t0;
   } else {
-    x = $[3];
+    t0 = $[3];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/interdependent.expect.md

@@ -37,29 +37,19 @@ import { c as _c } from "react/compiler-runtime"; /**
  *   return = <Foo a={a} b={b} />
  */
 function Component(props) {
-  const $ = _c(7);
-  let a;
-  let b;
+  const $ = _c(3);
+  let t0;
   if ($[0] !== props.a || $[1] !== props.b) {
-    a = compute(props.a);
-    b = compute(props.b);
+    const a = compute(props.a);
+    const b = compute(props.b);
+
+    t0 = <Foo a={a} b={b} />;
     foo(a, b);
     $[0] = props.a;
     $[1] = props.b;
-    $[2] = a;
-    $[3] = b;
+    $[2] = t0;
   } else {
-    a = $[2];
-    b = $[3];
-  }
-  let t0;
-  if ($[4] !== a || $[5] !== b) {
-    t0 = <Foo a={a} b={b} />;
-    $[4] = a;
-    $[5] = b;
-    $[6] = t0;
-  } else {
-    t0 = $[6];
+    t0 = $[2];
   }
   return t0;
 }

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/issue933-disjoint-set-infinite-loop.expect.md

@@ -42,17 +42,19 @@ function makeObj() {
 // This caused an infinite loop in the compiler
 function MyApp(props) {
   const $ = _c(1);
-  let y;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    y = makeObj();
+    const y = makeObj();
+
+    t0 = y;
     const tmp = y.a;
     const tmp2 = tmp.b;
     y.push(tmp2);
-    $[0] = y;
+    $[0] = t0;
   } else {
-    y = $[0];
+    t0 = $[0];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/jsx-freeze.expect.md

@@ -31,17 +31,19 @@ import { shallowCopy } from "shared-runtime";
 
 function Component(props) {
   const $ = _c(2);
-  let element;
+  let t0;
   if ($[0] !== props.width) {
     const childprops = { style: { width: props.width } };
-    element = _jsx("div", { childprops, children: '"hello world"' });
+    const element = _jsx("div", { childprops, children: '"hello world"' });
+
+    t0 = element;
     shallowCopy(childprops);
     $[0] = props.width;
-    $[1] = element;
+    $[1] = t0;
   } else {
-    element = $[1];
+    t0 = $[1];
   }
-  return element;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/lambda-capture-returned-alias.expect.md

@@ -43,7 +43,7 @@ function CaptureNotMutate(props) {
     t0 = $[1];
   }
   const idx = t0;
-  let aliasedElement;
+  let t1;
   if ($[2] !== props.el || $[3] !== idx) {
     const element = bar(props.el);
 
@@ -52,15 +52,17 @@ function CaptureNotMutate(props) {
       return arr[idx];
     };
 
-    aliasedElement = fn();
+    const aliasedElement = fn();
+
+    t1 = aliasedElement;
     mutate(aliasedElement);
     $[2] = props.el;
     $[3] = idx;
-    $[4] = aliasedElement;
+    $[4] = t1;
   } else {
-    aliasedElement = $[4];
+    t1 = $[4];
   }
-  return aliasedElement;
+  return t1;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/merge-nested-scopes-with-same-inputs.expect.md

@@ -35,21 +35,21 @@ import { setProperty } from "shared-runtime";
 
 function Component(props) {
   const $ = _c(2);
-  let y;
+  let t0;
   if ($[0] !== props.a) {
-    y = {};
+    const y = {};
 
+    t0 = y;
     const x = {};
     setProperty(x, props.a);
-
     y.a = props.a;
     y.x = x;
     $[0] = props.a;
-    $[1] = y;
+    $[1] = t0;
   } else {
-    y = $[1];
+    t0 = $[1];
   }
-  return y;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/merge-scopes-callback.expect.md

@@ -26,39 +26,33 @@ import { c as _c } from "react/compiler-runtime";
 import { useState } from "react";
 
 function Component() {
-  const $ = _c(4);
+  const $ = _c(3);
   const [state, setState] = useState(0);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
+    const onClick = () => {
       setState((s) => s + 1);
     };
+
+    t0 = <button onClick={onClick}>Increment</button>;
     $[0] = t0;
   } else {
     t0 = $[0];
   }
-  const onClick = t0;
   let t1;
-  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-    t1 = <button onClick={onClick}>Increment</button>;
-    $[1] = t1;
-  } else {
-    t1 = $[1];
-  }
-  let t2;
-  if ($[2] !== state) {
-    t2 = (
+  if ($[1] !== state) {
+    t1 = (
       <>
         <span>Count: {state}</span>
-        {t1}
+        {t0}
       </>
     );
-    $[2] = state;
-    $[3] = t2;
+    $[1] = state;
+    $[2] = t1;
   } else {
-    t2 = $[3];
+    t1 = $[2];
   }
-  return t2;
+  return t1;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/mutable-lifetime-with-aliasing.expect.md

@@ -68,14 +68,14 @@ function mutate(x, y) {
 
 function Component(props) {
   const $ = _c(1);
-  let x;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     const a = {};
     const b = [a];
     const c = {};
     const d = { c };
 
-    x = {};
+    const x = {};
     x.b = b;
     const y = mutate(x, d);
     if (a) {
@@ -89,12 +89,13 @@ function Component(props) {
     if (y) {
     }
 
+    t0 = x;
     mutate(x, null);
-    $[0] = x;
+    $[0] = t0;
   } else {
-    x = $[0];
+    t0 = $[0];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/mutation-during-jsx-construction.expect.md

@@ -29,19 +29,20 @@ import { identity, mutate, mutateAndReturnNewValue } from "shared-runtime";
 
 function Component(props) {
   const $ = _c(2);
-  let element;
+  let t0;
   if ($[0] !== props.value) {
     const key = {};
 
-    element = <div key={mutateAndReturnNewValue(key)}>{props.value}</div>;
+    const element = <div key={mutateAndReturnNewValue(key)}>{props.value}</div>;
 
+    t0 = element;
     mutate(key);
     $[0] = props.value;
-    $[1] = element;
+    $[1] = t0;
   } else {
-    element = $[1];
+    t0 = $[1];
   }
-  return element;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/mutation-within-capture-and-mutablerange.expect.md

@@ -53,22 +53,23 @@ import { mutate } from "shared-runtime";
 function useFoo(t0) {
   const $ = _c(3);
   const { a, b } = t0;
-  let z;
+  let t1;
   if ($[0] !== a || $[1] !== b) {
     const x = { a };
     const y = [b];
     mutate(x);
 
-    z = [mutate(y)];
+    const z = [mutate(y)];
 
+    t1 = z;
     mutate(y);
     $[0] = a;
     $[1] = b;
-    $[2] = z;
+    $[2] = t1;
   } else {
-    z = $[2];
+    t1 = $[2];
   }
-  return z;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/nested-scopes-begin-same-instr-valueblock.expect.md

@@ -33,17 +33,18 @@ import { identity, mutate } from "shared-runtime";
 function Foo(t0) {
   const $ = _c(2);
   const { cond } = t0;
-  let x;
+  let t1;
   if ($[0] !== cond) {
-    x = identity(identity(cond)) ? { a: 2 } : { b: 2 };
+    const x = identity(identity(cond)) ? { a: 2 } : { b: 2 };
 
+    t1 = x;
     mutate(x);
     $[0] = cond;
-    $[1] = x;
+    $[1] = t1;
   } else {
-    x = $[1];
+    t1 = $[1];
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/obj-literal-mutated-after-if-else.expect.md

@@ -22,22 +22,24 @@ function foo(a, b, c, d) {
 import { c as _c } from "react/compiler-runtime";
 function foo(a, b, c, d) {
   const $ = _c(3);
-  let x;
+  let t0;
   if ($[0] !== b || $[1] !== c) {
+    let x;
     if (someVal) {
       x = { b };
     } else {
       x = { c };
     }
 
+    t0 = x;
     x.f = 1;
     $[0] = b;
     $[1] = c;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/obj-mutated-after-if-else-with-alias.expect.md

@@ -25,8 +25,9 @@ import { c as _c } from "react/compiler-runtime";
 function foo(a, b, c, d) {
   const $ = _c(2);
   someObj();
-  let x;
+  let t0;
   if ($[0] !== a) {
+    let x;
     if (a) {
       const y = someObj();
       const z = y;
@@ -35,13 +36,14 @@ function foo(a, b, c, d) {
       x = someObj();
     }
 
+    t0 = x;
     x.f = 1;
     $[0] = a;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/obj-mutated-after-if-else.expect.md

@@ -23,21 +23,23 @@ import { c as _c } from "react/compiler-runtime";
 function foo(a, b, c, d) {
   const $ = _c(2);
   someObj();
-  let x;
+  let t0;
   if ($[0] !== a) {
+    let x;
     if (a) {
       x = someObj();
     } else {
       x = someObj();
     }
 
+    t0 = x;
     x.f = 1;
     $[0] = a;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/obj-mutated-after-nested-if-else-with-alias.expect.md

@@ -31,8 +31,9 @@ import { c as _c } from "react/compiler-runtime";
 function foo(a, b, c, d) {
   const $ = _c(3);
   someObj();
-  let x;
+  let t0;
   if ($[0] !== a || $[1] !== b) {
+    let x;
     if (a) {
       let z;
       if (b) {
@@ -47,14 +48,15 @@ function foo(a, b, c, d) {
       x = someObj();
     }
 
+    t0 = x;
     x.f = 1;
     $[0] = a;
     $[1] = b;
-    $[2] = x;
+    $[2] = t0;
   } else {
-    x = $[2];
+    t0 = $[2];
   }
-  return x;
+  return t0;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/object-method-shorthand-aliased-mutate-after.expect.md

@@ -29,22 +29,23 @@ import { createHookWrapper, mutate, mutateAndReturn } from "shared-runtime";
 function useHook(t0) {
   const $ = _c(2);
   const { value } = t0;
-  let obj;
+  let t1;
   if ($[0] !== value) {
     const x = mutateAndReturn({ value });
-    obj = {
+    const obj = {
       getValue() {
         return value;
       },
     };
 
+    t1 = obj;
     mutate(x);
     $[0] = value;
-    $[1] = obj;
+    $[1] = t1;
   } else {
-    obj = $[1];
+    t1 = $[1];
   }
-  return obj;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/object-method-shorthand-mutated-after.expect.md

@@ -29,22 +29,23 @@ import { createHookWrapper, mutate, mutateAndReturn } from "shared-runtime";
 function useHook(t0) {
   const $ = _c(2);
   const { value } = t0;
-  let obj;
+  let t1;
   if ($[0] !== value) {
     const x = mutateAndReturn({ value });
-    obj = {
+    const obj = {
       getValue() {
         return x;
       },
     };
 
+    t1 = obj;
     mutate(obj);
     $[0] = value;
-    $[1] = obj;
+    $[1] = t1;
   } else {
-    obj = $[1];
+    t1 = $[1];
   }
-  return obj;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/original-reactive-scopes-fork/mutation-within-capture-and-mutablerange.expect.md

@@ -54,31 +54,32 @@ import { mutate } from "shared-runtime";
 function useFoo(t0) {
   const $ = _c(5);
   const { a, b } = t0;
-  let z;
+  let t1;
   if ($[0] !== a || $[1] !== b) {
     const x = { a };
     const y = [b];
     mutate(x);
 
-    const t1 = mutate(y);
-    let t2;
-    if ($[3] !== t1) {
-      t2 = [t1];
-      $[3] = t1;
-      $[4] = t2;
+    const t2 = mutate(y);
+    let t3;
+    if ($[3] !== t2) {
+      t3 = [t2];
+      $[3] = t2;
+      $[4] = t3;
     } else {
-      t2 = $[4];
+      t3 = $[4];
     }
-    z = t2;
+    const z = t3;
 
+    t1 = z;
     mutate(y);
     $[0] = a;
     $[1] = b;
-    $[2] = z;
+    $[2] = t1;
   } else {
-    z = $[2];
+    t1 = $[2];
   }
-  return z;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/overlapping-scopes-shadowing-within-block.expect.md

@@ -28,30 +28,24 @@ export const FIXTURE_ENTRYPOINT = {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function foo(a, b, c) {
-  const $ = _c(9);
+  const $ = _c(7);
   let x;
   if ($[0] !== a || $[1] !== b || $[2] !== c) {
     x = [];
     if (a) {
-      let y;
+      let t0;
       if ($[4] !== b || $[5] !== c) {
-        y = [];
+        const y = [];
         if (b) {
           y.push(c);
         }
+
+        t0 = <div>{y}</div>;
         $[4] = b;
         $[5] = c;
-        $[6] = y;
+        $[6] = t0;
       } else {
-        y = $[6];
-      }
-      let t0;
-      if ($[7] !== y) {
-        t0 = <div>{y}</div>;
-        $[7] = y;
-        $[8] = t0;
-      } else {
-        t0 = $[8];
+        t0 = $[6];
       }
       x.push(t0);
     }

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/property-assignment.expect.md

@@ -25,8 +25,9 @@ function Component(props) {
     const y = [];
     x.y = y;
     const child = <Component data={y} />;
-    x.y.push(props.p0);
+
     t0 = <Component data={x}>{child}</Component>;
+    x.y.push(props.p0);
     $[0] = props.p0;
     $[1] = t0;
   } else {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/property-call-evaluation-order.expect.md

@@ -41,16 +41,17 @@ function Component() {
     t0 = $[0];
   }
   const changeF = t0;
-  let x;
+  let t1;
   if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-    x = { f: () => console.log("original") };
+    const x = { f: () => console.log("original") };
 
+    t1 = x;
     (console.log("A"), x).f((changeF(x), console.log("arg"), 1));
-    $[1] = x;
+    $[1] = t1;
   } else {
-    x = $[1];
+    t1 = $[1];
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reactive-scope-grouping.expect.md

@@ -26,18 +26,20 @@ export const FIXTURE_ENTRYPOINT = {
 import { c as _c } from "react/compiler-runtime";
 function foo() {
   const $ = _c(1);
-  let x;
+  let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    x = {};
+    const x = {};
+
+    t0 = x;
     const y = [];
     const z = {};
     y.push(z);
     x.y = y;
-    $[0] = x;
+    $[0] = t0;
   } else {
-    x = $[0];
+    t0 = $[0];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.expect.md

@@ -25,7 +25,7 @@ function Component(props) {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
-  const $ = _c(3);
+  const $ = _c(1);
   const x = makeObject();
   const user = useFragment(
     graphql`fragment Component_user on User { ... }`,
@@ -45,15 +45,7 @@ function Component(props) {
   posts.push(t0);
   const count = posts.length;
   foo(count);
-  let t1;
-  if ($[1] !== posts) {
-    t1 = <>{posts}</>;
-    $[1] = posts;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  return t1;
+  return <>{posts}</>;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.expect.md

@@ -23,38 +23,39 @@ function Component(props) {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
-  const $ = _c(5);
+  const $ = _c(4);
   const user = useFragment(
     graphql`fragment Component_user on User { ... }`,
     props.user,
   );
-  let posts;
-  if ($[0] !== user.timeline.posts.edges.nodes) {
-    posts = user.timeline.posts.edges.nodes.map((node) => <Post post={node} />);
-    let t0;
-    if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-      t0 = {};
-      $[2] = t0;
-    } else {
-      t0 = $[2];
-    }
-    posts.push(t0);
-    $[0] = user.timeline.posts.edges.nodes;
-    $[1] = posts;
-  } else {
-    posts = $[1];
-  }
-  const count = posts.length;
-  foo(count);
   let t0;
-  if ($[3] !== posts) {
-    t0 = <>{posts}</>;
-    $[3] = posts;
-    $[4] = t0;
+  let t1;
+  if ($[0] !== user.timeline.posts.edges.nodes) {
+    const posts = user.timeline.posts.edges.nodes.map((node) => (
+      <Post post={node} />
+    ));
+
+    t0 = posts;
+
+    t1 = <>{posts}</>;
+    let t2;
+    if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+      t2 = {};
+      $[3] = t2;
+    } else {
+      t2 = $[3];
+    }
+    posts.push(t2);
+    $[0] = user.timeline.posts.edges.nodes;
+    $[1] = t0;
+    $[2] = t1;
   } else {
-    t0 = $[4];
+    t0 = $[1];
+    t1 = $[2];
   }
-  return t0;
+  const count = t0.length;
+  foo(count);
+  return t1;
 }
 
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reassignment-conditional.expect.md

@@ -40,9 +40,8 @@ function Component(props) {
       x = t1;
     }
 
-    y.push(props.p2);
-
     t0 = <Component x={x} y={y} />;
+    y.push(props.p2);
     $[0] = props.p0;
     $[1] = props.p1;
     $[2] = props.p2;

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reassignment.expect.md

@@ -37,9 +37,8 @@ function Component(props) {
     }
     x = t1;
 
-    y.push(props.p1);
-
     t0 = <Component x={x} y={y} />;
+    y.push(props.p1);
     $[0] = props.p0;
     $[1] = props.p1;
     $[2] = t0;

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-cond-deps-return-in-scope.expect.md

@@ -31,33 +31,34 @@ import { c as _c } from "react/compiler-runtime";
 function useFoo(t0) {
   const $ = _c(4);
   const { obj, objIsNull } = t0;
-  let x;
   let t1;
+  let t2;
   if ($[0] !== objIsNull || $[1] !== obj) {
-    t1 = Symbol.for("react.early_return_sentinel");
+    t2 = Symbol.for("react.early_return_sentinel");
     bb0: {
-      x = [];
+      const x = [];
       if (objIsNull) {
-        t1 = undefined;
+        t2 = undefined;
         break bb0;
       } else {
         x.push(obj.a);
       }
 
+      t1 = x;
       x.push(obj.b);
     }
     $[0] = objIsNull;
     $[1] = obj;
-    $[2] = x;
-    $[3] = t1;
+    $[2] = t1;
+    $[3] = t2;
   } else {
-    x = $[2];
-    t1 = $[3];
+    t1 = $[2];
+    t2 = $[3];
   }
-  if (t1 !== Symbol.for("react.early_return_sentinel")) {
-    return t1;
+  if (t2 !== Symbol.for("react.early_return_sentinel")) {
+    return t2;
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/conditional-member-expr.expect.md

@@ -28,16 +28,18 @@ import { c as _c } from "react/compiler-runtime"; // To preserve the nullthrows
 
 function Component(props) {
   const $ = _c(2);
-  let x;
+  let t0;
   if ($[0] !== props.a) {
-    x = [];
+    const x = [];
+
+    t0 = x;
     x.push(props.a?.b);
     $[0] = props.a;
-    $[1] = x;
+    $[1] = t0;
   } else {
-    x = $[1];
+    t0 = $[1];
   }
-  return x;
+  return t0;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/jump-poisoned/return-in-scope.expect.md

@@ -33,31 +33,32 @@ import { c as _c } from "react/compiler-runtime";
 function useFoo(t0) {
   const $ = _c(4);
   const { obj, objIsNull } = t0;
-  let x;
   let t1;
+  let t2;
   if ($[0] !== objIsNull || $[1] !== obj) {
-    t1 = Symbol.for("react.early_return_sentinel");
+    t2 = Symbol.for("react.early_return_sentinel");
     bb0: {
-      x = [];
+      const x = [];
       if (objIsNull) {
-        t1 = undefined;
+        t2 = undefined;
         break bb0;
       }
 
+      t1 = x;
       x.push(obj.b);
     }
     $[0] = objIsNull;
     $[1] = obj;
-    $[2] = x;
-    $[3] = t1;
+    $[2] = t1;
+    $[3] = t2;
   } else {
-    x = $[2];
-    t1 = $[3];
+    t1 = $[2];
+    t2 = $[3];
   }
-  if (t1 !== Symbol.for("react.early_return_sentinel")) {
-    return t1;
+  if (t2 !== Symbol.for("react.early_return_sentinel")) {
+    return t2;
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/jump-poisoned/return-poisons-outer-scope.expect.md

@@ -39,38 +39,40 @@ import { identity } from "shared-runtime";
 function useFoo(t0) {
   const $ = _c(6);
   const { input, cond } = t0;
-  let x;
   let t1;
+  let t2;
   if ($[0] !== cond || $[1] !== input) {
-    t1 = Symbol.for("react.early_return_sentinel");
+    t2 = Symbol.for("react.early_return_sentinel");
     bb0: {
-      x = [];
+      const x = [];
       if (cond) {
-        t1 = null;
+        t2 = null;
         break bb0;
       }
-      let t2;
+
+      t1 = x;
+      let t3;
       if ($[4] !== input.a.b) {
-        t2 = identity(input.a.b);
+        t3 = identity(input.a.b);
         $[4] = input.a.b;
-        $[5] = t2;
+        $[5] = t3;
       } else {
-        t2 = $[5];
+        t3 = $[5];
       }
-      x.push(t2);
+      x.push(t3);
     }
     $[0] = cond;
     $[1] = input;
-    $[2] = x;
-    $[3] = t1;
+    $[2] = t1;
+    $[3] = t2;
   } else {
-    x = $[2];
-    t1 = $[3];
+    t1 = $[2];
+    t2 = $[3];
   }
-  if (t1 !== Symbol.for("react.early_return_sentinel")) {
-    return t1;
+  if (t2 !== Symbol.for("react.early_return_sentinel")) {
+    return t2;
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/jump-unpoisoned/jump-target-within-scope-label.expect.md

@@ -37,21 +37,22 @@ import { c as _c } from "react/compiler-runtime";
 function useFoo(t0) {
   const $ = _c(3);
   const { input, cond } = t0;
-  let x;
+  let t1;
   if ($[0] !== cond || $[1] !== input.a.b) {
-    x = [];
+    const x = [];
     bb0: if (cond) {
       break bb0;
     }
 
+    t1 = x;
     x.push(input.a.b);
     $[0] = cond;
     $[1] = input.a.b;
-    $[2] = x;
+    $[2] = t1;
   } else {
-    x = $[2];
+    t1 = $[2];
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/jump-unpoisoned/jump-target-within-scope-loop-break.expect.md

@@ -39,9 +39,9 @@ import { c as _c } from "react/compiler-runtime";
 function useFoo(t0) {
   const $ = _c(3);
   const { input, max } = t0;
-  let x;
+  let t1;
   if ($[0] !== max || $[1] !== input.a.b) {
-    x = [];
+    const x = [];
     let i = 0;
     while (true) {
       i = i + 1;
@@ -50,15 +50,16 @@ function useFoo(t0) {
       }
     }
 
+    t1 = x;
     x.push(i);
     x.push(input.a.b);
     $[0] = max;
     $[1] = input.a.b;
-    $[2] = x;
+    $[2] = t1;
   } else {
-    x = $[2];
+    t1 = $[2];
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/jump-unpoisoned/return-before-scope-starts.expect.md

@@ -51,16 +51,18 @@ function useFoo(t0) {
     }
     return t1;
   }
-  let x;
+  let t1;
   if ($[1] !== input.a.b) {
-    x = [];
+    const x = [];
+
+    t1 = x;
     arrayPush(x, input.a.b);
     $[1] = input.a.b;
-    $[2] = x;
+    $[2] = t1;
   } else {
-    x = $[2];
+    t1 = $[2];
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reduce-reactive-deps/jump-unpoisoned/throw-before-scope-starts.expect.md

@@ -44,16 +44,18 @@ function useFoo(t0) {
   if (cond) {
     throw new Error("throw with error!");
   }
-  let x;
+  let t1;
   if ($[0] !== input.a.b) {
-    x = [];
+    const x = [];
+
+    t1 = x;
     arrayPush(x, input.a.b);
     $[0] = input.a.b;
-    $[1] = x;
+    $[1] = t1;
   } else {
-    x = $[1];
+    t1 = $[1];
   }
-  return x;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {