Skip to content

Commit 6f45e9d

Browse files
committed
Update on "[compiler] Add types for WeakMap, WeakSet, and reanimated shared values"
Building on mofeiz's recent work to type constructors. Also, types for reanimated values which are useful in the next PR. [ghstack-poisoned]
1 parent 42c6348 commit 6f45e9d

File tree

5 files changed

+424
-2
lines changed

5 files changed

+424
-2
lines changed

compiler/packages/babel-plugin-react-compiler/src/HIR/ObjectShape.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -781,7 +781,7 @@ addObject(BUILTIN_SHAPES, BuiltInWeakSetId, [
781781
addFunction(BUILTIN_SHAPES, [], {
782782
positionalParams: [Effect.Capture],
783783
restParam: null,
784-
returnType: {kind: 'Object', shapeId: BuiltInSetId},
784+
returnType: {kind: 'Object', shapeId: BuiltInWeakSetId},
785785
calleeEffect: Effect.Store,
786786
// returnValueKind is technically dependent on the ValueKind of the set itself
787787
returnValueKind: ValueKind.Mutable,
@@ -857,7 +857,7 @@ addObject(BUILTIN_SHAPES, BuiltInWeakMapId, [
857857
addFunction(BUILTIN_SHAPES, [], {
858858
positionalParams: [Effect.Capture, Effect.Capture],
859859
restParam: null,
860-
returnType: {kind: 'Object', shapeId: BuiltInMapId},
860+
returnType: {kind: 'Object', shapeId: BuiltInWeakMapId},
861861
calleeEffect: Effect.Store,
862862
returnValueKind: ValueKind.Mutable,
863863
}),
Lines changed: 176 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,176 @@
1+
2+
## Input
3+
4+
```javascript
5+
import {ValidateMemoization} from 'shared-runtime';
6+
7+
function Component({a, b, c}) {
8+
const map = new WeakMap();
9+
const mapAlias = map.set(a, 0);
10+
mapAlias.set(c, 0);
11+
12+
const hasB = map.has(b);
13+
14+
return (
15+
<>
16+
<ValidateMemoization inputs={[a, c]} output={map} />
17+
<ValidateMemoization inputs={[a, c]} output={mapAlias} />
18+
<ValidateMemoization inputs={[b]} output={[hasB]} />
19+
</>
20+
);
21+
}
22+
23+
const v1 = {value: 1};
24+
const v2 = {value: 2};
25+
const v3 = {value: 3};
26+
export const FIXTURE_ENTRYPOINT = {
27+
fn: Component,
28+
params: [{a: v1, b: v1, c: v1}],
29+
sequentialRenders: [
30+
{a: v1, b: v1, c: v1},
31+
{a: v2, b: v1, c: v1},
32+
{a: v1, b: v1, c: v1},
33+
{a: v1, b: v2, c: v1},
34+
{a: v1, b: v1, c: v1},
35+
{a: v3, b: v3, c: v1},
36+
{a: v3, b: v3, c: v1},
37+
{a: v1, b: v1, c: v1},
38+
],
39+
};
40+
41+
```
42+
43+
## Code
44+
45+
```javascript
46+
import { c as _c } from "react/compiler-runtime";
47+
import { ValidateMemoization } from "shared-runtime";
48+
49+
function Component(t0) {
50+
const $ = _c(27);
51+
const { a, b, c } = t0;
52+
let map;
53+
let mapAlias;
54+
if ($[0] !== a || $[1] !== c) {
55+
map = new WeakMap();
56+
mapAlias = map.set(a, 0);
57+
mapAlias.set(c, 0);
58+
$[0] = a;
59+
$[1] = c;
60+
$[2] = map;
61+
$[3] = mapAlias;
62+
} else {
63+
map = $[2];
64+
mapAlias = $[3];
65+
}
66+
67+
const hasB = map.has(b);
68+
let t1;
69+
if ($[4] !== a || $[5] !== c) {
70+
t1 = [a, c];
71+
$[4] = a;
72+
$[5] = c;
73+
$[6] = t1;
74+
} else {
75+
t1 = $[6];
76+
}
77+
let t2;
78+
if ($[7] !== map || $[8] !== t1) {
79+
t2 = <ValidateMemoization inputs={t1} output={map} />;
80+
$[7] = map;
81+
$[8] = t1;
82+
$[9] = t2;
83+
} else {
84+
t2 = $[9];
85+
}
86+
let t3;
87+
if ($[10] !== a || $[11] !== c) {
88+
t3 = [a, c];
89+
$[10] = a;
90+
$[11] = c;
91+
$[12] = t3;
92+
} else {
93+
t3 = $[12];
94+
}
95+
let t4;
96+
if ($[13] !== mapAlias || $[14] !== t3) {
97+
t4 = <ValidateMemoization inputs={t3} output={mapAlias} />;
98+
$[13] = mapAlias;
99+
$[14] = t3;
100+
$[15] = t4;
101+
} else {
102+
t4 = $[15];
103+
}
104+
let t5;
105+
if ($[16] !== b) {
106+
t5 = [b];
107+
$[16] = b;
108+
$[17] = t5;
109+
} else {
110+
t5 = $[17];
111+
}
112+
let t6;
113+
if ($[18] !== hasB) {
114+
t6 = [hasB];
115+
$[18] = hasB;
116+
$[19] = t6;
117+
} else {
118+
t6 = $[19];
119+
}
120+
let t7;
121+
if ($[20] !== t5 || $[21] !== t6) {
122+
t7 = <ValidateMemoization inputs={t5} output={t6} />;
123+
$[20] = t5;
124+
$[21] = t6;
125+
$[22] = t7;
126+
} else {
127+
t7 = $[22];
128+
}
129+
let t8;
130+
if ($[23] !== t2 || $[24] !== t4 || $[25] !== t7) {
131+
t8 = (
132+
<>
133+
{t2}
134+
{t4}
135+
{t7}
136+
</>
137+
);
138+
$[23] = t2;
139+
$[24] = t4;
140+
$[25] = t7;
141+
$[26] = t8;
142+
} else {
143+
t8 = $[26];
144+
}
145+
return t8;
146+
}
147+
148+
const v1 = { value: 1 };
149+
const v2 = { value: 2 };
150+
const v3 = { value: 3 };
151+
export const FIXTURE_ENTRYPOINT = {
152+
fn: Component,
153+
params: [{ a: v1, b: v1, c: v1 }],
154+
sequentialRenders: [
155+
{ a: v1, b: v1, c: v1 },
156+
{ a: v2, b: v1, c: v1 },
157+
{ a: v1, b: v1, c: v1 },
158+
{ a: v1, b: v2, c: v1 },
159+
{ a: v1, b: v1, c: v1 },
160+
{ a: v3, b: v3, c: v1 },
161+
{ a: v3, b: v3, c: v1 },
162+
{ a: v1, b: v1, c: v1 },
163+
],
164+
};
165+
166+
```
167+
168+
### Eval output
169+
(kind: ok) <div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1}],"output":[true]}</div>
170+
<div>{"inputs":[{"value":2},{"value":1}],"output":{}}</div><div>{"inputs":[{"value":2},{"value":1}],"output":{}}</div><div>{"inputs":[{"value":1}],"output":[true]}</div>
171+
<div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1}],"output":[true]}</div>
172+
<div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":2}],"output":[false]}</div>
173+
<div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1}],"output":[true]}</div>
174+
<div>{"inputs":[{"value":3},{"value":1}],"output":{}}</div><div>{"inputs":[{"value":3},{"value":1}],"output":{}}</div><div>{"inputs":[{"value":3}],"output":[true]}</div>
175+
<div>{"inputs":[{"value":3},{"value":1}],"output":{}}</div><div>{"inputs":[{"value":3},{"value":1}],"output":{}}</div><div>{"inputs":[{"value":3}],"output":[true]}</div>
176+
<div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1},"[[ cyclic ref *2 ]]"],"output":{}}</div><div>{"inputs":[{"value":1}],"output":[true]}</div>
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import {ValidateMemoization} from 'shared-runtime';
2+
3+
function Component({a, b, c}) {
4+
const map = new WeakMap();
5+
const mapAlias = map.set(a, 0);
6+
mapAlias.set(c, 0);
7+
8+
const hasB = map.has(b);
9+
10+
return (
11+
<>
12+
<ValidateMemoization inputs={[a, c]} output={map} />
13+
<ValidateMemoization inputs={[a, c]} output={mapAlias} />
14+
<ValidateMemoization inputs={[b]} output={[hasB]} />
15+
</>
16+
);
17+
}
18+
19+
const v1 = {value: 1};
20+
const v2 = {value: 2};
21+
const v3 = {value: 3};
22+
export const FIXTURE_ENTRYPOINT = {
23+
fn: Component,
24+
params: [{a: v1, b: v1, c: v1}],
25+
sequentialRenders: [
26+
{a: v1, b: v1, c: v1},
27+
{a: v2, b: v1, c: v1},
28+
{a: v1, b: v1, c: v1},
29+
{a: v1, b: v2, c: v1},
30+
{a: v1, b: v1, c: v1},
31+
{a: v3, b: v3, c: v1},
32+
{a: v3, b: v3, c: v1},
33+
{a: v1, b: v1, c: v1},
34+
],
35+
};

0 commit comments

Comments
 (0)