Example suboptimal memoization with non-inlined useMemo

This commit is contained in:
Joe Savona
2023-04-07 16:34:51 -07:00
parent 6122f21393
commit f7f7a88e19
2 changed files with 70 additions and 0 deletions
@@ -0,0 +1,61 @@
## Input
```javascript
function Component(props) {
const [a, b] = useMemo(() => {
const items = [];
const a = makeObject(props.a);
const b = makeObject(props.b);
return [a, b];
});
return [a, b];
}
```
## Code
```javascript
function Component(props) {
const $ = React.unstable_useMemoCache(7);
const c_0 = $[0] !== props.a;
let t0;
if (c_0) {
t0 = () => {
const items = [];
const a = makeObject(props.a);
const b = makeObject(props.b);
return [a, b];
};
$[0] = props.a;
$[1] = t0;
} else {
t0 = $[1];
}
const c_2 = $[2] !== t0;
let t1;
if (c_2) {
t1 = t0();
$[2] = t0;
$[3] = t1;
} else {
t1 = $[3];
}
const [a_0, b_0] = t1;
const c_4 = $[4] !== a_0;
const c_5 = $[5] !== b_0;
let t2;
if (c_4 || c_5) {
t2 = [a_0, b_0];
$[4] = a_0;
$[5] = b_0;
$[6] = t2;
} else {
t2 = $[6];
}
return t2;
}
```
@@ -0,0 +1,9 @@
function Component(props) {
const [a, b] = useMemo(() => {
const items = [];
const a = makeObject(props.a);
const b = makeObject(props.b);
return [a, b];
});
return [a, b];
}