Skip to content

Commit acc5032

Browse files
committed
cached measurment -> latest measurment
1 parent 1944fac commit acc5032

File tree

3 files changed

+29
-32
lines changed

3 files changed

+29
-32
lines changed

src/core/native/index.tsx

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -118,17 +118,15 @@ const updateOutlines = async (fiber: Fiber, render: Render) => {
118118
return null;
119119
}
120120

121-
// console.log('nice', measurement);
122121
try {
123122
const existingOutline = ReactScanInternals.activeOutlines.find(
124123
({ outline }) => {
125124
return (
126-
getKey(assertNative(outline.cachedMeasurement).value) ===
125+
getKey(assertNative(outline.latestMeasurement).value) ===
127126
getKey(measurement)
128127
);
129128
},
130129
);
131-
// console.log('hi', existingOutline);
132130

133131
// if an outline exists we just update the renders
134132
if (existingOutline) {
@@ -141,7 +139,7 @@ const updateOutlines = async (fiber: Fiber, render: Render) => {
141139
ReactScanInternals.activeOutlines = getCopiedActiveOutlines();
142140
} else {
143141
const newOutline: PendingOutline = {
144-
cachedMeasurement: {
142+
latestMeasurement: {
145143
kind: 'native',
146144
value: measurement,
147145
},
@@ -156,7 +154,7 @@ const updateOutlines = async (fiber: Fiber, render: Render) => {
156154
id: genId(),
157155
resolve: () => {
158156
// resolve();
159-
// todo, update this,
157+
// todo, update this/inject options into update outlines,
160158
// options.onPaintFinish?.(outline);
161159
},
162160
text: getLabelText(newOutline.renders, 'native'),

src/core/native/scan.tsx

Lines changed: 13 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -188,9 +188,8 @@ const ReactNativeScan = ({ id: _ }: { id: string }) => {
188188
>
189189
<Group opacity={animatedOpacity}>
190190
{outlines
191-
// we can maybe take this out of render if Dimensions.get is cheap
192191
.filter(({ outline }) => {
193-
const measurement = assertNative(outline.cachedMeasurement).value;
192+
const measurement = assertNative(outline.latestMeasurement).value;
194193
const vis = isVisible(measurement.x, measurement.y);
195194
return vis;
196195
})
@@ -202,33 +201,33 @@ const ReactNativeScan = ({ id: _ }: { id: string }) => {
202201
return (
203202
<Group key={render.id}>
204203
<Rect
205-
x={assertNative(render.outline.cachedMeasurement).value.pageX}
206-
y={assertNative(render.outline.cachedMeasurement).value.pageY}
204+
x={assertNative(render.outline.latestMeasurement).value.pageX}
205+
y={assertNative(render.outline.latestMeasurement).value.pageY}
207206
width={
208-
assertNative(render.outline.cachedMeasurement).value.width
207+
assertNative(render.outline.latestMeasurement).value.width
209208
}
210209
height={
211-
assertNative(render.outline.cachedMeasurement).value.height
210+
assertNative(render.outline.latestMeasurement).value.height
212211
}
213212
color="rgba(88, 82, 185, 0.1)"
214213
/>
215214
<Rect
216-
x={assertNative(render.outline.cachedMeasurement).value.pageX}
217-
y={assertNative(render.outline.cachedMeasurement).value.pageY}
215+
x={assertNative(render.outline.latestMeasurement).value.pageX}
216+
y={assertNative(render.outline.latestMeasurement).value.pageY}
218217
width={
219-
assertNative(render.outline.cachedMeasurement).value.width
218+
assertNative(render.outline.latestMeasurement).value.width
220219
}
221220
height={
222-
assertNative(render.outline.cachedMeasurement).value.height
221+
assertNative(render.outline.latestMeasurement).value.height
223222
}
224223
color="rgba(147, 141, 255, 0.6)"
225224
style="stroke"
226225
strokeWidth={1}
227226
/>
228227
<Rect
229-
x={assertNative(render.outline.cachedMeasurement).value.pageX}
228+
x={assertNative(render.outline.latestMeasurement).value.pageX}
230229
y={
231-
assertNative(render.outline.cachedMeasurement).value.pageY -
230+
assertNative(render.outline.latestMeasurement).value.pageY -
232231
labelHeight -
233232
2
234233
}
@@ -238,11 +237,11 @@ const ReactNativeScan = ({ id: _ }: { id: string }) => {
238237
/>
239238
<Text
240239
x={
241-
assertNative(render.outline.cachedMeasurement).value.pageX +
240+
assertNative(render.outline.latestMeasurement).value.pageX +
242241
labelPadding
243242
}
244243
y={
245-
assertNative(render.outline.cachedMeasurement).value.pageY -
244+
assertNative(render.outline.latestMeasurement).value.pageY -
246245
5
247246
}
248247
text={render.text || 'unknown'}

src/core/web/outline.ts

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export const assertDom = (measurement: Measurement) => {
1717

1818
export interface PendingOutline {
1919
fiber: Fiber; // todo, weak ref not always available
20-
cachedMeasurement: Measurement;
20+
latestMeasurement: Measurement;
2121
renders: Render[];
2222
}
2323

@@ -129,7 +129,7 @@ export const getOutline = (
129129
return {
130130
fiber: fiber,
131131
renders: [render],
132-
cachedMeasurement: {
132+
latestMeasurement: {
133133
kind: 'dom',
134134
value: rect,
135135
},
@@ -140,7 +140,7 @@ export const mergeOutlines = (outlines: PendingOutline[]) => {
140140
const mergedOutlines = new Map<string, PendingOutline>();
141141
for (let i = 0, len = outlines.length; i < len; i++) {
142142
const outline = outlines[i];
143-
const key = getOutlineKey(assertDom(outline.cachedMeasurement).value);
143+
const key = getOutlineKey(assertDom(outline.latestMeasurement).value);
144144
const existingOutline = mergedOutlines.get(key);
145145

146146
if (!existingOutline) {
@@ -173,7 +173,7 @@ export const recalcOutlines = throttle(() => {
173173
scheduledOutlines.splice(i, 1);
174174
continue;
175175
}
176-
outline.cachedMeasurement.value = rect;
176+
outline.latestMeasurement.value = rect;
177177
}
178178

179179
for (let i = activeOutlines.length - 1; i >= 0; i--) {
@@ -187,7 +187,7 @@ export const recalcOutlines = throttle(() => {
187187
activeOutlines.splice(i, 1);
188188
continue;
189189
}
190-
outline.cachedMeasurement.value = rect;
190+
outline.latestMeasurement.value = rect;
191191
}
192192
}, DEFAULT_THROTTLE_TIME);
193193

@@ -238,7 +238,7 @@ export const flushOutlines = (
238238

239239
await Promise.all(
240240
mergedOutlines.map(async (outline) => {
241-
const key = getOutlineKey(assertDom(outline.cachedMeasurement).value);
241+
const key = getOutlineKey(assertDom(outline.latestMeasurement).value);
242242
if (previousOutlines.has(key)) {
243243
return;
244244
}
@@ -270,11 +270,11 @@ export const paintOutline = (
270270
log(outline.renders);
271271
}
272272

273-
const key = getOutlineKey(assertDom(outline.cachedMeasurement).value); // todo: fix for dom
273+
const key = getOutlineKey(assertDom(outline.latestMeasurement).value); // todo: fix for dom
274274
const existingActiveOutline = ReactScanInternals.activeOutlines.find(
275275
(activeOutline) =>
276276
getOutlineKey(
277-
assertDom(activeOutline.outline.cachedMeasurement).value,
277+
assertDom(activeOutline.outline.latestMeasurement).value,
278278
) === key,
279279
);
280280

@@ -293,8 +293,8 @@ export const paintOutline = (
293293

294294
if (existingActiveOutline) {
295295
existingActiveOutline.outline.renders.push(...outline.renders);
296-
existingActiveOutline.outline.cachedMeasurement =
297-
outline.cachedMeasurement;
296+
existingActiveOutline.outline.latestMeasurement =
297+
outline.latestMeasurement;
298298
existingActiveOutline.frame = 0;
299299
existingActiveOutline.totalFrames = totalFrames;
300300
existingActiveOutline.alpha = alpha;
@@ -350,10 +350,10 @@ export const fadeOutOutline = (ctx: CanvasRenderingContext2D) => {
350350
}
351351
const newRect = getRect(domNode);
352352
if (newRect) {
353-
outline.cachedMeasurement.value = newRect;
353+
outline.latestMeasurement.value = newRect;
354354
}
355355
});
356-
const { value: rect } = assertDom(outline.cachedMeasurement);
356+
const { value: rect } = assertDom(outline.latestMeasurement);
357357
const unstable = isOutlineUnstable(outline);
358358

359359
const alphaScalar = unstable ? 0.8 : 0.2;
@@ -393,7 +393,7 @@ export const fadeOutOutline = (ctx: CanvasRenderingContext2D) => {
393393

394394
for (let i = 0, len = pendingLabeledOutlines.length; i < len; i++) {
395395
const { alpha, outline, text } = pendingLabeledOutlines[i];
396-
const { value: rect } = assertDom(outline.cachedMeasurement); // todo: fix for dom
396+
const { value: rect } = assertDom(outline.latestMeasurement); // todo: fix for dom
397397
ctx.save();
398398

399399
if (text) {

0 commit comments

Comments
 (0)