@buoy-gg/highlight-updates 7.0.35 → 7.0.38
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -6
- package/lib/commonjs/highlight-updates/HighlightUpdatesOverlay.js +1 -281
- package/lib/commonjs/highlight-updates/components/HighlightFilterView.js +1 -1474
- package/lib/commonjs/highlight-updates/components/HighlightUpdatesModal.js +1 -641
- package/lib/commonjs/highlight-updates/components/IdentifierBadge.js +1 -273
- package/lib/commonjs/highlight-updates/components/IsolatedRenderList.js +1 -188
- package/lib/commonjs/highlight-updates/components/ModalHeaderContent.js +1 -293
- package/lib/commonjs/highlight-updates/components/RenderCauseBadge.js +1 -508
- package/lib/commonjs/highlight-updates/components/RenderDetailView.js +1 -846
- package/lib/commonjs/highlight-updates/components/RenderHistoryViewer.js +1 -915
- package/lib/commonjs/highlight-updates/components/RenderListItem.js +1 -235
- package/lib/commonjs/highlight-updates/components/RendersCopySettingsView.js +1 -466
- package/lib/commonjs/highlight-updates/components/StatsDisplay.js +1 -73
- package/lib/commonjs/highlight-updates/types/copySettings.js +1 -107
- package/lib/commonjs/highlight-updates/utils/CommitProfiler.js +1 -446
- package/lib/commonjs/highlight-updates/utils/HighlightUpdatesController.js +1 -1920
- package/lib/commonjs/highlight-updates/utils/PerformanceLogger.js +1 -359
- package/lib/commonjs/highlight-updates/utils/ProfilerInterceptor.js +1 -371
- package/lib/commonjs/highlight-updates/utils/RenderCauseDetector.js +1 -1840
- package/lib/commonjs/highlight-updates/utils/RenderTracker.js +1 -952
- package/lib/commonjs/highlight-updates/utils/ViewTypeMapper.js +1 -264
- package/lib/commonjs/highlight-updates/utils/copySettingsStorage.js +1 -32
- package/lib/commonjs/highlight-updates/utils/devtoolsComponentNames.js +1 -188
- package/lib/commonjs/highlight-updates/utils/namedComposite.js +1 -41
- package/lib/commonjs/highlight-updates/utils/ownStateChanged.js +1 -103
- package/lib/commonjs/highlight-updates/utils/rawEventEmitter.js +1 -50
- package/lib/commonjs/highlight-updates/utils/renderExportFormatter.js +1 -58
- package/lib/commonjs/highlight-updates/utils/rendersExportFormatter.js +1 -485
- package/lib/commonjs/highlight-updates/utils/screenElements.js +1 -1046
- package/lib/commonjs/highlight-updates/utils/tapMatch.js +1 -58
- package/lib/commonjs/highlight-updates/utils/testIDs.js +1 -68
- package/lib/commonjs/highlight-updates/utils/touchCapture.js +1 -277
- package/lib/commonjs/index.js +1 -429
- package/lib/commonjs/preset.js +1 -278
- package/lib/commonjs/sync/highlightUpdatesSyncAdapter.js +1 -235
- package/lib/module/highlight-updates/HighlightUpdatesOverlay.js +1 -274
- package/lib/module/highlight-updates/components/HighlightFilterView.js +1 -1468
- package/lib/module/highlight-updates/components/HighlightUpdatesModal.js +1 -634
- package/lib/module/highlight-updates/components/IdentifierBadge.js +1 -265
- package/lib/module/highlight-updates/components/IsolatedRenderList.js +1 -183
- package/lib/module/highlight-updates/components/ModalHeaderContent.js +1 -288
- package/lib/module/highlight-updates/components/RenderCauseBadge.js +1 -499
- package/lib/module/highlight-updates/components/RenderDetailView.js +1 -840
- package/lib/module/highlight-updates/components/RenderHistoryViewer.js +1 -908
- package/lib/module/highlight-updates/components/RenderListItem.js +1 -230
- package/lib/module/highlight-updates/components/RendersCopySettingsView.js +1 -462
- package/lib/module/highlight-updates/components/StatsDisplay.js +1 -70
- package/lib/module/highlight-updates/types/copySettings.js +1 -102
- package/lib/module/highlight-updates/utils/CommitProfiler.js +1 -442
- package/lib/module/highlight-updates/utils/HighlightUpdatesController.js +1 -1916
- package/lib/module/highlight-updates/utils/PerformanceLogger.js +1 -353
- package/lib/module/highlight-updates/utils/ProfilerInterceptor.js +1 -358
- package/lib/module/highlight-updates/utils/RenderCauseDetector.js +1 -1830
- package/lib/module/highlight-updates/utils/RenderTracker.js +1 -949
- package/lib/module/highlight-updates/utils/ViewTypeMapper.js +1 -255
- package/lib/module/highlight-updates/utils/copySettingsStorage.js +1 -26
- package/lib/module/highlight-updates/utils/devtoolsComponentNames.js +1 -178
- package/lib/module/highlight-updates/utils/namedComposite.js +1 -36
- package/lib/module/highlight-updates/utils/ownStateChanged.js +1 -98
- package/lib/module/highlight-updates/utils/rawEventEmitter.js +1 -46
- package/lib/module/highlight-updates/utils/renderExportFormatter.js +1 -54
- package/lib/module/highlight-updates/utils/rendersExportFormatter.js +1 -478
- package/lib/module/highlight-updates/utils/screenElements.js +1 -1040
- package/lib/module/highlight-updates/utils/tapMatch.js +1 -52
- package/lib/module/highlight-updates/utils/testIDs.js +1 -60
- package/lib/module/highlight-updates/utils/touchCapture.js +1 -270
- package/lib/module/index.js +1 -130
- package/lib/module/preset.js +1 -272
- package/lib/module/sync/highlightUpdatesSyncAdapter.js +1 -230
- package/lib/typescript/highlight-updates/utils/screenElements.d.ts +52 -1
- package/lib/typescript/highlight-updates/utils/tapMatch.d.ts +11 -0
- package/lib/typescript/sync/highlightUpdatesSyncAdapter.d.ts +1 -1
- package/package.json +8 -8
- package/lib/typescript/highlight-updates/HighlightUpdatesOverlay.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/HighlightFilterView.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/HighlightUpdatesModal.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/IdentifierBadge.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/IsolatedRenderList.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/ModalHeaderContent.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/RenderCauseBadge.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/RenderDetailView.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/RenderHistoryViewer.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/RenderListItem.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/RendersCopySettingsView.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/components/StatsDisplay.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/types/copySettings.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/CommitProfiler.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/HighlightUpdatesController.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/PerformanceLogger.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/ProfilerInterceptor.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/RenderCauseDetector.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/RenderTracker.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/ViewTypeMapper.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/copySettingsStorage.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/devtoolsComponentNames.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/namedComposite.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/ownStateChanged.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/rawEventEmitter.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/renderExportFormatter.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/rendersExportFormatter.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/screenElements.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/tapMatch.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/testIDs.d.ts.map +0 -1
- package/lib/typescript/highlight-updates/utils/touchCapture.d.ts.map +0 -1
- package/lib/typescript/index.d.ts.map +0 -1
- package/lib/typescript/preset.d.ts.map +0 -1
- package/lib/typescript/sync/highlightUpdatesSyncAdapter.d.ts.map +0 -1
|
@@ -1,46 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* The one guarded require for React Native's RawEventEmitter.
|
|
5
|
-
*
|
|
6
|
-
* `RawEventEmitter` mirrors every event React Native dispatches BEFORE React's
|
|
7
|
-
* plugins or components see it, which makes it the only way to observe what a
|
|
8
|
-
* HUMAN is touching without instrumenting the app: Buoy mounts as a sibling of
|
|
9
|
-
* the app tree, not a parent, so there is no root View to put a capture
|
|
10
|
-
* responder on.
|
|
11
|
-
*
|
|
12
|
-
* Two things this file is careful about, both learned the hard way in
|
|
13
|
-
* focus-inspector's copy:
|
|
14
|
-
*
|
|
15
|
-
* 1. It is a DEEP import that RN's export map warns about and could move in any
|
|
16
|
-
* release. The failure has to degrade to "capture unavailable" rather than
|
|
17
|
-
* taking the host app's bundle down — and Metro only treats a require as
|
|
18
|
-
* optional when it sits LEXICALLY inside a try statement, so wrapping it in
|
|
19
|
-
* a helper or an arrow makes Metro hard-fail the bundle instead.
|
|
20
|
-
* 2. Keeping it in its own module gives the unit suite a seam: Node's `require`
|
|
21
|
-
* ignores Vitest's module mocks, so the emitter can only be faked by mocking
|
|
22
|
-
* a module reached with a real `import`.
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
|
-
export function resolveRawEventEmitter() {
|
|
26
|
-
let mod;
|
|
27
|
-
try {
|
|
28
|
-
mod = require("react-native/Libraries/Core/RawEventEmitter");
|
|
29
|
-
} catch (e) {
|
|
30
|
-
return {
|
|
31
|
-
emitter: null,
|
|
32
|
-
reason: e?.message ?? "RawEventEmitter is unavailable"
|
|
33
|
-
};
|
|
34
|
-
}
|
|
35
|
-
const candidate = mod?.default ?? mod;
|
|
36
|
-
if (typeof candidate?.addListener !== "function") {
|
|
37
|
-
return {
|
|
38
|
-
emitter: null,
|
|
39
|
-
reason: "RawEventEmitter has no addListener"
|
|
40
|
-
};
|
|
41
|
-
}
|
|
42
|
-
return {
|
|
43
|
-
emitter: candidate,
|
|
44
|
-
reason: null
|
|
45
|
-
};
|
|
46
|
-
}
|
|
1
|
+
"use strict";export function resolveRawEventEmitter(){let e;try{e=require("react-native/Libraries/Core/RawEventEmitter")}catch(e){return{emitter:null,reason:e?.message??"RawEventEmitter is unavailable"}}const t=e?.default??e;return"function"!=typeof t?.addListener?{emitter:null,reason:"RawEventEmitter has no addListener"}:{emitter:t,reason:null}}
|
|
@@ -1,54 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Render Export Formatter
|
|
5
|
-
*
|
|
6
|
-
* Simple JSON export for render tracking data.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* Generate JSON export of all tracked renders
|
|
11
|
-
*/
|
|
12
|
-
export function generateRendersJson(renders) {
|
|
13
|
-
const exportData = {
|
|
14
|
-
exportedAt: new Date().toISOString(),
|
|
15
|
-
totalComponents: renders.length,
|
|
16
|
-
totalRenders: renders.reduce((sum, r) => sum + r.renderCount, 0),
|
|
17
|
-
components: renders.map(render => ({
|
|
18
|
-
// Identity
|
|
19
|
-
componentName: render.componentName || render.displayName,
|
|
20
|
-
viewType: render.viewType,
|
|
21
|
-
nativeTag: render.nativeTag,
|
|
22
|
-
// Identifiers
|
|
23
|
-
testID: render.testID,
|
|
24
|
-
nativeID: render.nativeID,
|
|
25
|
-
accessibilityLabel: render.accessibilityLabel,
|
|
26
|
-
// Render stats
|
|
27
|
-
renderCount: render.renderCount,
|
|
28
|
-
firstRenderTime: render.firstRenderTime,
|
|
29
|
-
lastRenderTime: render.lastRenderTime,
|
|
30
|
-
// Last render cause
|
|
31
|
-
lastRenderCause: render.lastRenderCause ? {
|
|
32
|
-
type: render.lastRenderCause.type,
|
|
33
|
-
componentCause: render.lastRenderCause.componentCause,
|
|
34
|
-
changedKeys: render.lastRenderCause.changedKeys,
|
|
35
|
-
hookChanges: render.lastRenderCause.hookChanges?.map(h => ({
|
|
36
|
-
type: h.type,
|
|
37
|
-
index: h.index,
|
|
38
|
-
description: h.description
|
|
39
|
-
}))
|
|
40
|
-
} : null,
|
|
41
|
-
// Render history (if available)
|
|
42
|
-
renderHistory: render.renderHistory?.map(event => ({
|
|
43
|
-
renderNumber: event.renderNumber,
|
|
44
|
-
timestamp: event.timestamp,
|
|
45
|
-
cause: {
|
|
46
|
-
type: event.cause.type,
|
|
47
|
-
componentCause: event.cause.componentCause,
|
|
48
|
-
changedKeys: event.cause.changedKeys
|
|
49
|
-
}
|
|
50
|
-
}))
|
|
51
|
-
}))
|
|
52
|
-
};
|
|
53
|
-
return JSON.stringify(exportData, null, 2);
|
|
54
|
-
}
|
|
1
|
+
"use strict";export function generateRendersJson(e){const n={exportedAt:(new Date).toISOString(),totalComponents:e.length,totalRenders:e.reduce((e,n)=>e+n.renderCount,0),components:e.map(e=>({componentName:e.componentName||e.displayName,viewType:e.viewType,nativeTag:e.nativeTag,testID:e.testID,nativeID:e.nativeID,accessibilityLabel:e.accessibilityLabel,renderCount:e.renderCount,firstRenderTime:e.firstRenderTime,lastRenderTime:e.lastRenderTime,lastRenderCause:e.lastRenderCause?{type:e.lastRenderCause.type,componentCause:e.lastRenderCause.componentCause,changedKeys:e.lastRenderCause.changedKeys,hookChanges:e.lastRenderCause.hookChanges?.map(e=>({type:e.type,index:e.index,description:e.description}))}:null,renderHistory:e.renderHistory?.map(e=>({renderNumber:e.renderNumber,timestamp:e.timestamp,cause:{type:e.cause.type,componentCause:e.cause.componentCause,changedKeys:e.cause.changedKeys}}))}))};return JSON.stringify(n,null,2)}
|
|
@@ -1,478 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Renders Export Formatter
|
|
5
|
-
*
|
|
6
|
-
* Pipeline: TrackedRender[] -> filter -> group -> aggregate -> sort -> format.
|
|
7
|
-
* Goal: compact, debug-focused output. Reports facts, not opinions.
|
|
8
|
-
*/
|
|
9
|
-
|
|
10
|
-
// =============================================================================
|
|
11
|
-
// Internal types
|
|
12
|
-
// =============================================================================
|
|
13
|
-
|
|
14
|
-
// =============================================================================
|
|
15
|
-
// Pipeline
|
|
16
|
-
// =============================================================================
|
|
17
|
-
|
|
18
|
-
function buildReport(renders, settings) {
|
|
19
|
-
let working = renders.filter(r => r.renderCount >= settings.minRenders);
|
|
20
|
-
if (settings.filterCauses.length > 0) {
|
|
21
|
-
const allowed = new Set(settings.filterCauses);
|
|
22
|
-
working = working.filter(r => allowed.has(r.lastRenderCause?.type ?? "unknown"));
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
// Window — computed from the original render list, not after topN
|
|
26
|
-
const allTimes = renders.flatMap(r => [r.firstRenderTime, r.lastRenderTime]).filter(t => Number.isFinite(t));
|
|
27
|
-
const windowMs = allTimes.length > 0 ? Math.max(...allTimes) - Math.min(...allTimes) : 0;
|
|
28
|
-
const windowSec = Math.max(0.001, windowMs / 1000);
|
|
29
|
-
const groups = settings.groupByName ? groupByComponentName(working) : working.map(r => [r]);
|
|
30
|
-
const processed = groups.map(group => processGroup(group, settings, windowSec));
|
|
31
|
-
sortRows(processed, settings.sortBy);
|
|
32
|
-
const truncated = settings.topN === -1 ? 0 : Math.max(0, processed.length - settings.topN);
|
|
33
|
-
const rows = settings.topN === -1 ? processed : processed.slice(0, settings.topN);
|
|
34
|
-
const totalRenders = renders.reduce((sum, r) => sum + r.renderCount, 0);
|
|
35
|
-
const causeBreakdown = aggregateCauseBreakdown(renders);
|
|
36
|
-
|
|
37
|
-
// Data-gap detection from the source renders (not after filtering)
|
|
38
|
-
let rendersWithoutCause = 0;
|
|
39
|
-
let historyPresent = false;
|
|
40
|
-
for (const r of renders) {
|
|
41
|
-
if (!r.lastRenderCause) rendersWithoutCause += r.renderCount;
|
|
42
|
-
if (r.renderHistory && r.renderHistory.length > 0) historyPresent = true;
|
|
43
|
-
}
|
|
44
|
-
return {
|
|
45
|
-
totalUniqueComponents: working.length,
|
|
46
|
-
totalRenders,
|
|
47
|
-
windowMs,
|
|
48
|
-
causeBreakdown,
|
|
49
|
-
rows,
|
|
50
|
-
truncated,
|
|
51
|
-
dataGaps: {
|
|
52
|
-
historyOff: !historyPresent,
|
|
53
|
-
// We can't directly observe whether the capture settings are on,
|
|
54
|
-
// but we can detect their effects: capturedProps/capturedState in events.
|
|
55
|
-
propsCaptureOff: !renders.some(r => r.renderHistory?.some(e => e.capturedProps !== undefined)),
|
|
56
|
-
stateCaptureOff: !renders.some(r => r.renderHistory?.some(e => e.capturedState !== undefined)),
|
|
57
|
-
rendersWithoutCause
|
|
58
|
-
}
|
|
59
|
-
};
|
|
60
|
-
}
|
|
61
|
-
function groupByComponentName(renders) {
|
|
62
|
-
const map = new Map();
|
|
63
|
-
for (const r of renders) {
|
|
64
|
-
const key = r.componentName || r.displayName || r.viewType;
|
|
65
|
-
const existing = map.get(key);
|
|
66
|
-
if (existing) {
|
|
67
|
-
existing.push(r);
|
|
68
|
-
} else {
|
|
69
|
-
map.set(key, [r]);
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
return Array.from(map.values());
|
|
73
|
-
}
|
|
74
|
-
function processGroup(group, settings, windowSec) {
|
|
75
|
-
const first = group[0];
|
|
76
|
-
const name = first.componentName || first.displayName || first.viewType;
|
|
77
|
-
let renders = 0;
|
|
78
|
-
const causeMix = {};
|
|
79
|
-
const hookCounter = new Map();
|
|
80
|
-
const changedKeyCounter = new Map();
|
|
81
|
-
const parentNameCounter = new Map();
|
|
82
|
-
let unknownPropsCount = 0;
|
|
83
|
-
let parentWithOwnChange = 0;
|
|
84
|
-
let parentNoChange = 0;
|
|
85
|
-
for (const r of group) {
|
|
86
|
-
renders += r.renderCount;
|
|
87
|
-
const cause = r.lastRenderCause;
|
|
88
|
-
if (!cause) continue;
|
|
89
|
-
const causeType = cause.type;
|
|
90
|
-
causeMix[causeType] = (causeMix[causeType] ?? 0) + r.renderCount;
|
|
91
|
-
|
|
92
|
-
// Track parent-cascade subtypes
|
|
93
|
-
const hadHookChange = (cause.hookChanges?.length ?? 0) > 0;
|
|
94
|
-
const hadKeyChange = (cause.changedKeys?.length ?? 0) > 0;
|
|
95
|
-
if (causeType === "parent") {
|
|
96
|
-
const ownChange = cause.componentCause === "state" || cause.componentCause === "props" || hadHookChange || hadKeyChange;
|
|
97
|
-
if (ownChange) parentWithOwnChange += r.renderCount;else parentNoChange += r.renderCount;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
// Track props with no key info (cause detector saw a change but couldn't identify which)
|
|
101
|
-
if (causeType === "props" && !hadKeyChange) {
|
|
102
|
-
unknownPropsCount += r.renderCount;
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
// Parent name observation
|
|
106
|
-
if (cause.parentComponentName) {
|
|
107
|
-
parentNameCounter.set(cause.parentComponentName, (parentNameCounter.get(cause.parentComponentName) ?? 0) + 1);
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
// Aggregate hook causes
|
|
111
|
-
if (settings.aggregateCauses && cause.hookChanges) {
|
|
112
|
-
for (const hc of cause.hookChanges) {
|
|
113
|
-
const key = `${hc.type}[${hc.index}]`;
|
|
114
|
-
const existing = hookCounter.get(key);
|
|
115
|
-
if (existing) {
|
|
116
|
-
existing.count += 1;
|
|
117
|
-
} else {
|
|
118
|
-
hookCounter.set(key, {
|
|
119
|
-
count: 1,
|
|
120
|
-
sample: formatHookSample(hc)
|
|
121
|
-
});
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
// Aggregate changed keys (skip ref-only marks)
|
|
127
|
-
if (cause.changedKeys) {
|
|
128
|
-
for (const key of cause.changedKeys) {
|
|
129
|
-
if (key.includes("(ref only)")) continue;
|
|
130
|
-
changedKeyCounter.set(key, (changedKeyCounter.get(key) ?? 0) + 1);
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
const hookCauses = Array.from(hookCounter.entries()).sort((a, b) => b[1].count - a[1].count).slice(0, 3).map(([hook, info]) => ({
|
|
135
|
-
hook,
|
|
136
|
-
count: info.count,
|
|
137
|
-
sample: info.sample
|
|
138
|
-
}));
|
|
139
|
-
const changedKeys = Array.from(changedKeyCounter.entries()).sort((a, b) => b[1] - a[1]).slice(0, 5).map(([k]) => k);
|
|
140
|
-
let dominantCause = "unknown";
|
|
141
|
-
let max = -1;
|
|
142
|
-
for (const [cause, count] of Object.entries(causeMix)) {
|
|
143
|
-
if ((count ?? 0) > max) {
|
|
144
|
-
max = count ?? 0;
|
|
145
|
-
dominantCause = cause;
|
|
146
|
-
}
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
// Pick the most-observed parent name
|
|
150
|
-
let parentName;
|
|
151
|
-
let parentMax = 0;
|
|
152
|
-
for (const [n, c] of parentNameCounter) {
|
|
153
|
-
if (c > parentMax) {
|
|
154
|
-
parentMax = c;
|
|
155
|
-
parentName = n;
|
|
156
|
-
}
|
|
157
|
-
}
|
|
158
|
-
const instanceCounts = group.map(r => r.renderCount).sort((a, b) => b - a);
|
|
159
|
-
const rate = renders / windowSec;
|
|
160
|
-
return {
|
|
161
|
-
name,
|
|
162
|
-
viewType: first.viewType,
|
|
163
|
-
instances: group.length,
|
|
164
|
-
renders,
|
|
165
|
-
causeMix,
|
|
166
|
-
dominantCause,
|
|
167
|
-
hookCauses,
|
|
168
|
-
changedKeys,
|
|
169
|
-
unknownPropsCount,
|
|
170
|
-
parentWithOwnChange,
|
|
171
|
-
parentNoChange,
|
|
172
|
-
parentName,
|
|
173
|
-
instanceCounts,
|
|
174
|
-
rate,
|
|
175
|
-
source: group
|
|
176
|
-
};
|
|
177
|
-
}
|
|
178
|
-
function aggregateCauseBreakdown(renders) {
|
|
179
|
-
const out = {};
|
|
180
|
-
for (const r of renders) {
|
|
181
|
-
const t = r.lastRenderCause?.type ?? "unknown";
|
|
182
|
-
out[t] = (out[t] ?? 0) + r.renderCount;
|
|
183
|
-
}
|
|
184
|
-
return out;
|
|
185
|
-
}
|
|
186
|
-
function sortRows(rows, sortBy) {
|
|
187
|
-
switch (sortBy) {
|
|
188
|
-
case "renderCount":
|
|
189
|
-
rows.sort((a, b) => b.renders - a.renders);
|
|
190
|
-
break;
|
|
191
|
-
case "rate":
|
|
192
|
-
rows.sort((a, b) => b.rate - a.rate);
|
|
193
|
-
break;
|
|
194
|
-
case "name":
|
|
195
|
-
rows.sort((a, b) => a.name.localeCompare(b.name));
|
|
196
|
-
break;
|
|
197
|
-
}
|
|
198
|
-
}
|
|
199
|
-
|
|
200
|
-
// =============================================================================
|
|
201
|
-
// Helpers
|
|
202
|
-
// =============================================================================
|
|
203
|
-
|
|
204
|
-
const VALUE_MAX_LEN = 32;
|
|
205
|
-
function truncateValue(v) {
|
|
206
|
-
if (v === null) return "null";
|
|
207
|
-
if (v === undefined) return "undefined";
|
|
208
|
-
if (typeof v === "function") return "[Fn]";
|
|
209
|
-
if (typeof v === "object") {
|
|
210
|
-
if (Array.isArray(v)) return `[Array(${v.length})]`;
|
|
211
|
-
return "[Obj]";
|
|
212
|
-
}
|
|
213
|
-
const s = String(v);
|
|
214
|
-
return s.length > VALUE_MAX_LEN ? s.slice(0, VALUE_MAX_LEN - 1) + "…" : s;
|
|
215
|
-
}
|
|
216
|
-
function formatHookSample(hc) {
|
|
217
|
-
if (hc.previousValue === undefined && hc.currentValue === undefined) {
|
|
218
|
-
return hc.description;
|
|
219
|
-
}
|
|
220
|
-
return `${truncateValue(hc.previousValue)} → ${truncateValue(hc.currentValue)}`;
|
|
221
|
-
}
|
|
222
|
-
function formatWindow(ms) {
|
|
223
|
-
if (ms < 1000) return `${ms}ms`;
|
|
224
|
-
return `${(ms / 1000).toFixed(1)}s`;
|
|
225
|
-
}
|
|
226
|
-
function formatRate(rate) {
|
|
227
|
-
if (rate >= 100) return `${rate.toFixed(0)}/s`;
|
|
228
|
-
if (rate >= 10) return `${rate.toFixed(1)}/s`;
|
|
229
|
-
return `${rate.toFixed(2)}/s`;
|
|
230
|
-
}
|
|
231
|
-
function causeBreakdownLine(breakdown) {
|
|
232
|
-
const entries = Object.entries(breakdown).sort((a, b) => (b[1] ?? 0) - (a[1] ?? 0));
|
|
233
|
-
if (entries.length === 0) return "(no causes recorded)";
|
|
234
|
-
return entries.map(([k, v]) => `${k} ${v}`).join(" · ");
|
|
235
|
-
}
|
|
236
|
-
function describeCause(row) {
|
|
237
|
-
const parts = [];
|
|
238
|
-
|
|
239
|
-
// Per-row cause mix when at least 2 causes contribute (≥10% each)
|
|
240
|
-
const mixEntries = Object.entries(row.causeMix).filter(([, v]) => (v ?? 0) > 0).sort((a, b) => (b[1] ?? 0) - (a[1] ?? 0));
|
|
241
|
-
const showMix = mixEntries.length >= 2 && (mixEntries[1]?.[1] ?? 0) >= row.renders * 0.1;
|
|
242
|
-
if (row.dominantCause === "hooks" && row.hookCauses.length > 0) {
|
|
243
|
-
const top = row.hookCauses[0];
|
|
244
|
-
if (top.sample) {
|
|
245
|
-
parts.push(`hooks ×${top.count} ${top.hook}: ${top.sample}`);
|
|
246
|
-
} else {
|
|
247
|
-
parts.push(`hooks ×${top.count} ${top.hook}`);
|
|
248
|
-
}
|
|
249
|
-
} else if (row.dominantCause === "props") {
|
|
250
|
-
if (row.changedKeys.length > 0) {
|
|
251
|
-
const keys = row.changedKeys.slice(0, 3).join(", ");
|
|
252
|
-
parts.push(`props (${keys})`);
|
|
253
|
-
} else {
|
|
254
|
-
parts.push(`props (keys not captured)`);
|
|
255
|
-
}
|
|
256
|
-
if (row.unknownPropsCount > 0 && row.changedKeys.length > 0) {
|
|
257
|
-
parts.push(`[${row.unknownPropsCount} unidentified]`);
|
|
258
|
-
}
|
|
259
|
-
} else if (row.dominantCause === "parent") {
|
|
260
|
-
let label = "parent cascade";
|
|
261
|
-
if (row.parentNoChange > 0 && row.parentWithOwnChange === 0) {
|
|
262
|
-
label = "parent cascade, no own change";
|
|
263
|
-
}
|
|
264
|
-
if (row.parentName) label += ` ← ${row.parentName}`;
|
|
265
|
-
parts.push(label);
|
|
266
|
-
} else if (row.dominantCause === "mount") {
|
|
267
|
-
parts.push("mount");
|
|
268
|
-
} else if (row.dominantCause === "state") {
|
|
269
|
-
parts.push("state");
|
|
270
|
-
} else if (row.dominantCause === "context") {
|
|
271
|
-
parts.push("context");
|
|
272
|
-
} else {
|
|
273
|
-
parts.push("unknown");
|
|
274
|
-
}
|
|
275
|
-
if (showMix) {
|
|
276
|
-
const mixStr = mixEntries.map(([k, v]) => `${k}:${v}`).join(" + ");
|
|
277
|
-
parts.push(`(${mixStr})`);
|
|
278
|
-
}
|
|
279
|
-
return parts.join(" ");
|
|
280
|
-
}
|
|
281
|
-
function describeInstances(row) {
|
|
282
|
-
if (row.instances <= 1) return row.name;
|
|
283
|
-
const counts = row.instanceCounts;
|
|
284
|
-
const max = counts[0] ?? 0;
|
|
285
|
-
const min = counts[counts.length - 1] ?? 0;
|
|
286
|
-
const evenly = max - min <= 1;
|
|
287
|
-
if (evenly) {
|
|
288
|
-
return `${row.name} ×${row.instances} (${max} each)`;
|
|
289
|
-
}
|
|
290
|
-
// Uneven — show top instance vs others
|
|
291
|
-
const others = counts.slice(1);
|
|
292
|
-
const othersSum = others.reduce((s, n) => s + n, 0);
|
|
293
|
-
const othersAvg = others.length > 0 ? othersSum / others.length : 0;
|
|
294
|
-
return `${row.name} ×${row.instances} (top ${max}, others ~${Math.round(othersAvg)})`;
|
|
295
|
-
}
|
|
296
|
-
|
|
297
|
-
// =============================================================================
|
|
298
|
-
// Format generators
|
|
299
|
-
// =============================================================================
|
|
300
|
-
|
|
301
|
-
const LLM_PREAMBLE = "React Native render report — review the data and identify why components are re-rendering.";
|
|
302
|
-
function generateSummary(report, _settings) {
|
|
303
|
-
const lines = [];
|
|
304
|
-
lines.push(LLM_PREAMBLE);
|
|
305
|
-
lines.push("");
|
|
306
|
-
lines.push(`Window: ${formatWindow(report.windowMs)} · ${report.totalUniqueComponents} components · ${report.totalRenders} renders`);
|
|
307
|
-
lines.push(`Cause mix: ${causeBreakdownLine(report.causeBreakdown)}`);
|
|
308
|
-
lines.push("");
|
|
309
|
-
lines.push("Top offenders (count · rate · component · cause):");
|
|
310
|
-
lines.push("");
|
|
311
|
-
const nameStrings = report.rows.map(describeInstances);
|
|
312
|
-
const nameWidth = Math.min(36, Math.max(8, ...nameStrings.map(n => n.length)));
|
|
313
|
-
const countWidth = Math.max(3, ...report.rows.map(r => `×${r.renders}`.length));
|
|
314
|
-
const rateWidth = Math.max(5, ...report.rows.map(r => formatRate(r.rate).length));
|
|
315
|
-
for (let i = 0; i < report.rows.length; i++) {
|
|
316
|
-
const row = report.rows[i];
|
|
317
|
-
const name = (nameStrings[i] ?? row.name).padEnd(nameWidth);
|
|
318
|
-
const count = `×${row.renders}`.padStart(countWidth);
|
|
319
|
-
const rate = formatRate(row.rate).padStart(rateWidth);
|
|
320
|
-
const reason = describeCause(row);
|
|
321
|
-
lines.push(` ${count} ${rate} ${name} ${reason}`);
|
|
322
|
-
}
|
|
323
|
-
if (report.truncated > 0) {
|
|
324
|
-
lines.push("");
|
|
325
|
-
lines.push(`... ${report.truncated} more (set topN=-1 to expand)`);
|
|
326
|
-
}
|
|
327
|
-
|
|
328
|
-
// Data-availability footer
|
|
329
|
-
const footer = buildDataFooter(report);
|
|
330
|
-
if (footer.length > 0) {
|
|
331
|
-
lines.push("");
|
|
332
|
-
lines.push("Data availability:");
|
|
333
|
-
for (const line of footer) lines.push(` · ${line}`);
|
|
334
|
-
}
|
|
335
|
-
return lines.join("\n");
|
|
336
|
-
}
|
|
337
|
-
function buildDataFooter(report) {
|
|
338
|
-
const out = [];
|
|
339
|
-
if (report.dataGaps.rendersWithoutCause > 0) {
|
|
340
|
-
out.push(`${report.dataGaps.rendersWithoutCause} renders had no cause info (enable trackRenderCauses for more detail)`);
|
|
341
|
-
}
|
|
342
|
-
if (report.dataGaps.propsCaptureOff) {
|
|
343
|
-
out.push("prop snapshots not captured (enable capturePropsOnRender to see prop diffs for 'props (keys not captured)' rows)");
|
|
344
|
-
}
|
|
345
|
-
if (report.dataGaps.stateCaptureOff) {
|
|
346
|
-
out.push("state snapshots not captured (enable captureStateOnRender)");
|
|
347
|
-
}
|
|
348
|
-
if (report.dataGaps.historyOff) {
|
|
349
|
-
out.push("render history off (enable enableRenderHistory for per-render timeline)");
|
|
350
|
-
}
|
|
351
|
-
return out;
|
|
352
|
-
}
|
|
353
|
-
function generateMarkdownTable(report, _settings) {
|
|
354
|
-
const lines = [];
|
|
355
|
-
lines.push(`# React Render Report`);
|
|
356
|
-
lines.push("");
|
|
357
|
-
lines.push(`**Window:** ${formatWindow(report.windowMs)} · **Components:** ${report.totalUniqueComponents} · **Renders:** ${report.totalRenders}`);
|
|
358
|
-
lines.push(`**Cause mix:** ${causeBreakdownLine(report.causeBreakdown)}`);
|
|
359
|
-
lines.push("");
|
|
360
|
-
lines.push("| Component | Renders | Rate | Cause |");
|
|
361
|
-
lines.push("|---|---:|---:|---|");
|
|
362
|
-
for (const row of report.rows) {
|
|
363
|
-
const name = describeInstances(row);
|
|
364
|
-
const reason = describeCause(row).replace(/\|/g, "\\|");
|
|
365
|
-
lines.push(`| ${name} | ${row.renders} | ${formatRate(row.rate)} | ${reason} |`);
|
|
366
|
-
}
|
|
367
|
-
if (report.truncated > 0) {
|
|
368
|
-
lines.push("");
|
|
369
|
-
lines.push(`_... ${report.truncated} more rows_`);
|
|
370
|
-
}
|
|
371
|
-
const footer = buildDataFooter(report);
|
|
372
|
-
if (footer.length > 0) {
|
|
373
|
-
lines.push("");
|
|
374
|
-
lines.push("**Data availability:**");
|
|
375
|
-
for (const line of footer) lines.push(`- ${line}`);
|
|
376
|
-
}
|
|
377
|
-
return lines.join("\n");
|
|
378
|
-
}
|
|
379
|
-
function generateJson(_renders, report, settings) {
|
|
380
|
-
const exportData = {
|
|
381
|
-
exportedAt: new Date().toISOString(),
|
|
382
|
-
summary: {
|
|
383
|
-
windowMs: report.windowMs,
|
|
384
|
-
totalComponents: report.totalUniqueComponents,
|
|
385
|
-
totalRenders: report.totalRenders,
|
|
386
|
-
causeBreakdown: report.causeBreakdown,
|
|
387
|
-
truncated: report.truncated,
|
|
388
|
-
dataGaps: report.dataGaps
|
|
389
|
-
},
|
|
390
|
-
components: report.rows.map(row => ({
|
|
391
|
-
name: row.name,
|
|
392
|
-
viewType: row.viewType,
|
|
393
|
-
instances: row.instances,
|
|
394
|
-
instanceCounts: row.instances > 1 ? row.instanceCounts : undefined,
|
|
395
|
-
renders: row.renders,
|
|
396
|
-
ratePerSec: Number(row.rate.toFixed(3)),
|
|
397
|
-
dominantCause: row.dominantCause,
|
|
398
|
-
causeMix: row.causeMix,
|
|
399
|
-
hookCauses: row.hookCauses,
|
|
400
|
-
changedKeys: row.changedKeys,
|
|
401
|
-
unknownPropsCount: row.unknownPropsCount || undefined,
|
|
402
|
-
parentName: row.parentName,
|
|
403
|
-
parentWithOwnChange: row.parentWithOwnChange || undefined,
|
|
404
|
-
parentNoChange: row.parentNoChange || undefined,
|
|
405
|
-
...(settings.includeHistory ? {
|
|
406
|
-
history: extractHistory(row.source)
|
|
407
|
-
} : {})
|
|
408
|
-
}))
|
|
409
|
-
};
|
|
410
|
-
return settings.includeHistory ? JSON.stringify(exportData, null, 2) : JSON.stringify(exportData);
|
|
411
|
-
}
|
|
412
|
-
function extractHistory(source) {
|
|
413
|
-
return source.map(r => ({
|
|
414
|
-
name: r.componentName || r.displayName,
|
|
415
|
-
nativeTag: r.nativeTag,
|
|
416
|
-
renderCount: r.renderCount,
|
|
417
|
-
history: r.renderHistory?.map(e => ({
|
|
418
|
-
n: e.renderNumber,
|
|
419
|
-
t: e.timestamp,
|
|
420
|
-
cause: {
|
|
421
|
-
type: e.cause.type,
|
|
422
|
-
componentCause: e.cause.componentCause,
|
|
423
|
-
changedKeys: e.cause.changedKeys,
|
|
424
|
-
parentComponentName: e.cause.parentComponentName,
|
|
425
|
-
hookChanges: e.cause.hookChanges?.map(h => ({
|
|
426
|
-
type: h.type,
|
|
427
|
-
index: h.index,
|
|
428
|
-
desc: h.description
|
|
429
|
-
}))
|
|
430
|
-
}
|
|
431
|
-
}))
|
|
432
|
-
}));
|
|
433
|
-
}
|
|
434
|
-
|
|
435
|
-
// =============================================================================
|
|
436
|
-
// Public API
|
|
437
|
-
// =============================================================================
|
|
438
|
-
|
|
439
|
-
export function generateExport(renders, settings) {
|
|
440
|
-
const report = buildReport(renders, settings);
|
|
441
|
-
switch (settings.format) {
|
|
442
|
-
case "summary":
|
|
443
|
-
return generateSummary(report, settings);
|
|
444
|
-
case "markdown-table":
|
|
445
|
-
return generateMarkdownTable(report, settings);
|
|
446
|
-
case "json":
|
|
447
|
-
return generateJson(renders, report, settings);
|
|
448
|
-
default:
|
|
449
|
-
return generateSummary(report, settings);
|
|
450
|
-
}
|
|
451
|
-
}
|
|
452
|
-
export function estimateExportSize(renders, settings) {
|
|
453
|
-
return generateExport(renders, settings).length;
|
|
454
|
-
}
|
|
455
|
-
export function getExportSummary(renders) {
|
|
456
|
-
return {
|
|
457
|
-
totalComponents: renders.length,
|
|
458
|
-
totalRenders: renders.reduce((sum, r) => sum + r.renderCount, 0)
|
|
459
|
-
};
|
|
460
|
-
}
|
|
461
|
-
|
|
462
|
-
/**
|
|
463
|
-
* Export a single component's detail (used by RenderDetailView copy button).
|
|
464
|
-
* Always uses the summary format since detail copies are inherently small.
|
|
465
|
-
*/
|
|
466
|
-
export function generateSingleComponentExport(render) {
|
|
467
|
-
const settings = {
|
|
468
|
-
format: "summary",
|
|
469
|
-
topN: -1,
|
|
470
|
-
minRenders: 1,
|
|
471
|
-
filterCauses: [],
|
|
472
|
-
groupByName: false,
|
|
473
|
-
aggregateCauses: true,
|
|
474
|
-
sortBy: "renderCount",
|
|
475
|
-
includeHistory: false
|
|
476
|
-
};
|
|
477
|
-
return generateExport([render], settings);
|
|
478
|
-
}
|
|
1
|
+
"use strict";function buildReport(e,n){let t=e.filter(e=>e.renderCount>=n.minRenders);if(n.filterCauses.length>0){const e=new Set(n.filterCauses);t=t.filter(n=>e.has(n.lastRenderCause?.type??"unknown"))}const o=e.flatMap(e=>[e.firstRenderTime,e.lastRenderTime]).filter(e=>Number.isFinite(e)),r=o.length>0?Math.max(...o)-Math.min(...o):0,a=Math.max(.001,r/1e3),s=(n.groupByName?groupByComponentName(t):t.map(e=>[e])).map(e=>processGroup(e,n,a));sortRows(s,n.sortBy);const u=-1===n.topN?0:Math.max(0,s.length-n.topN),p=-1===n.topN?s:s.slice(0,n.topN),i=e.reduce((e,n)=>e+n.renderCount,0),c=aggregateCauseBreakdown(e);let d=0,m=!1;for(const n of e)n.lastRenderCause||(d+=n.renderCount),n.renderHistory&&n.renderHistory.length>0&&(m=!0);return{totalUniqueComponents:t.length,totalRenders:i,windowMs:r,causeBreakdown:c,rows:p,truncated:u,dataGaps:{historyOff:!m,propsCaptureOff:!e.some(e=>e.renderHistory?.some(e=>void 0!==e.capturedProps)),stateCaptureOff:!e.some(e=>e.renderHistory?.some(e=>void 0!==e.capturedState)),rendersWithoutCause:d}}}function groupByComponentName(e){const n=new Map;for(const t of e){const e=t.componentName||t.displayName||t.viewType,o=n.get(e);o?o.push(t):n.set(e,[t])}return Array.from(n.values())}function processGroup(e,n,t){const o=e[0],r=o.componentName||o.displayName||o.viewType;let a=0;const s={},u=new Map,p=new Map,i=new Map;let c=0,d=0,m=0;for(const t of e){a+=t.renderCount;const e=t.lastRenderCause;if(!e)continue;const o=e.type;s[o]=(s[o]??0)+t.renderCount;const r=(e.hookChanges?.length??0)>0,h=(e.changedKeys?.length??0)>0;if("parent"===o&&("state"===e.componentCause||"props"===e.componentCause||r||h?d+=t.renderCount:m+=t.renderCount),"props"!==o||h||(c+=t.renderCount),e.parentComponentName&&i.set(e.parentComponentName,(i.get(e.parentComponentName)??0)+1),n.aggregateCauses&&e.hookChanges)for(const n of e.hookChanges){const e=`${n.type}[${n.index}]`,t=u.get(e);t?t.count+=1:u.set(e,{count:1,sample:formatHookSample(n)})}if(e.changedKeys)for(const n of e.changedKeys)n.includes("(ref only)")||p.set(n,(p.get(n)??0)+1)}const h=Array.from(u.entries()).sort((e,n)=>n[1].count-e[1].count).slice(0,3).map(([e,n])=>({hook:e,count:n.count,sample:n.sample})),l=Array.from(p.entries()).sort((e,n)=>n[1]-e[1]).slice(0,5).map(([e])=>e);let f,C="unknown",g=-1;for(const[e,n]of Object.entries(s))(n??0)>g&&(g=n??0,C=e);let y=0;for(const[e,n]of i)n>y&&(y=n,f=e);const w=e.map(e=>e.renderCount).sort((e,n)=>n-e),$=a/t;return{name:r,viewType:o.viewType,instances:e.length,renders:a,causeMix:s,dominantCause:C,hookCauses:h,changedKeys:l,unknownPropsCount:c,parentWithOwnChange:d,parentNoChange:m,parentName:f,instanceCounts:w,rate:$,source:e}}function aggregateCauseBreakdown(e){const n={};for(const t of e){const e=t.lastRenderCause?.type??"unknown";n[e]=(n[e]??0)+t.renderCount}return n}function sortRows(e,n){switch(n){case"renderCount":e.sort((e,n)=>n.renders-e.renders);break;case"rate":e.sort((e,n)=>n.rate-e.rate);break;case"name":e.sort((e,n)=>e.name.localeCompare(n.name))}}const VALUE_MAX_LEN=32;function truncateValue(e){if(null===e)return"null";if(void 0===e)return"undefined";if("function"==typeof e)return"[Fn]";if("object"==typeof e)return Array.isArray(e)?`[Array(${e.length})]`:"[Obj]";const n=String(e);return n.length>32?n.slice(0,31)+"…":n}function formatHookSample(e){return void 0===e.previousValue&&void 0===e.currentValue?e.description:`${truncateValue(e.previousValue)} → ${truncateValue(e.currentValue)}`}function formatWindow(e){return e<1e3?`${e}ms`:`${(e/1e3).toFixed(1)}s`}function formatRate(e){return e>=100?`${e.toFixed(0)}/s`:e>=10?`${e.toFixed(1)}/s`:`${e.toFixed(2)}/s`}function causeBreakdownLine(e){const n=Object.entries(e).sort((e,n)=>(n[1]??0)-(e[1]??0));return 0===n.length?"(no causes recorded)":n.map(([e,n])=>`${e} ${n}`).join(" · ")}function describeCause(e){const n=[],t=Object.entries(e.causeMix).filter(([,e])=>(e??0)>0).sort((e,n)=>(n[1]??0)-(e[1]??0)),o=t.length>=2&&(t[1]?.[1]??0)>=.1*e.renders;if("hooks"===e.dominantCause&&e.hookCauses.length>0){const t=e.hookCauses[0];t.sample?n.push(`hooks ×${t.count} ${t.hook}: ${t.sample}`):n.push(`hooks ×${t.count} ${t.hook}`)}else if("props"===e.dominantCause){if(e.changedKeys.length>0){const t=e.changedKeys.slice(0,3).join(", ");n.push(`props (${t})`)}else n.push("props (keys not captured)");e.unknownPropsCount>0&&e.changedKeys.length>0&&n.push(`[${e.unknownPropsCount} unidentified]`)}else if("parent"===e.dominantCause){let t="parent cascade";e.parentNoChange>0&&0===e.parentWithOwnChange&&(t="parent cascade, no own change"),e.parentName&&(t+=` ← ${e.parentName}`),n.push(t)}else"mount"===e.dominantCause?n.push("mount"):"state"===e.dominantCause?n.push("state"):"context"===e.dominantCause?n.push("context"):n.push("unknown");if(o){const e=t.map(([e,n])=>`${e}:${n}`).join(" + ");n.push(`(${e})`)}return n.join(" ")}function describeInstances(e){if(e.instances<=1)return e.name;const n=e.instanceCounts,t=n[0]??0;if(t-(n[n.length-1]??0)<=1)return`${e.name} ×${e.instances} (${t} each)`;const o=n.slice(1),r=o.reduce((e,n)=>e+n,0),a=o.length>0?r/o.length:0;return`${e.name} ×${e.instances} (top ${t}, others ~${Math.round(a)})`}const LLM_PREAMBLE="React Native render report — review the data and identify why components are re-rendering.";function generateSummary(e,n){const t=[];t.push(LLM_PREAMBLE),t.push(""),t.push(`Window: ${formatWindow(e.windowMs)} · ${e.totalUniqueComponents} components · ${e.totalRenders} renders`),t.push(`Cause mix: ${causeBreakdownLine(e.causeBreakdown)}`),t.push(""),t.push("Top offenders (count · rate · component · cause):"),t.push("");const o=e.rows.map(describeInstances),r=Math.min(36,Math.max(8,...o.map(e=>e.length))),a=Math.max(3,...e.rows.map(e=>`×${e.renders}`.length)),s=Math.max(5,...e.rows.map(e=>formatRate(e.rate).length));for(let n=0;n<e.rows.length;n++){const u=e.rows[n],p=(o[n]??u.name).padEnd(r),i=`×${u.renders}`.padStart(a),c=formatRate(u.rate).padStart(s),d=describeCause(u);t.push(` ${i} ${c} ${p} ${d}`)}e.truncated>0&&(t.push(""),t.push(`... ${e.truncated} more (set topN=-1 to expand)`));const u=buildDataFooter(e);if(u.length>0){t.push(""),t.push("Data availability:");for(const e of u)t.push(` · ${e}`)}return t.join("\n")}function buildDataFooter(e){const n=[];return e.dataGaps.rendersWithoutCause>0&&n.push(`${e.dataGaps.rendersWithoutCause} renders had no cause info (enable trackRenderCauses for more detail)`),e.dataGaps.propsCaptureOff&&n.push("prop snapshots not captured (enable capturePropsOnRender to see prop diffs for 'props (keys not captured)' rows)"),e.dataGaps.stateCaptureOff&&n.push("state snapshots not captured (enable captureStateOnRender)"),e.dataGaps.historyOff&&n.push("render history off (enable enableRenderHistory for per-render timeline)"),n}function generateMarkdownTable(e,n){const t=[];t.push("# React Render Report"),t.push(""),t.push(`**Window:** ${formatWindow(e.windowMs)} · **Components:** ${e.totalUniqueComponents} · **Renders:** ${e.totalRenders}`),t.push(`**Cause mix:** ${causeBreakdownLine(e.causeBreakdown)}`),t.push(""),t.push("| Component | Renders | Rate | Cause |"),t.push("|---|---:|---:|---|");for(const n of e.rows){const e=describeInstances(n),o=describeCause(n).replace(/\|/g,"\\|");t.push(`| ${e} | ${n.renders} | ${formatRate(n.rate)} | ${o} |`)}e.truncated>0&&(t.push(""),t.push(`_... ${e.truncated} more rows_`));const o=buildDataFooter(e);if(o.length>0){t.push(""),t.push("**Data availability:**");for(const e of o)t.push(`- ${e}`)}return t.join("\n")}function generateJson(e,n,t){const o={exportedAt:(new Date).toISOString(),summary:{windowMs:n.windowMs,totalComponents:n.totalUniqueComponents,totalRenders:n.totalRenders,causeBreakdown:n.causeBreakdown,truncated:n.truncated,dataGaps:n.dataGaps},components:n.rows.map(e=>({name:e.name,viewType:e.viewType,instances:e.instances,instanceCounts:e.instances>1?e.instanceCounts:void 0,renders:e.renders,ratePerSec:Number(e.rate.toFixed(3)),dominantCause:e.dominantCause,causeMix:e.causeMix,hookCauses:e.hookCauses,changedKeys:e.changedKeys,unknownPropsCount:e.unknownPropsCount||void 0,parentName:e.parentName,parentWithOwnChange:e.parentWithOwnChange||void 0,parentNoChange:e.parentNoChange||void 0,...t.includeHistory?{history:extractHistory(e.source)}:{}}))};return t.includeHistory?JSON.stringify(o,null,2):JSON.stringify(o)}function extractHistory(e){return e.map(e=>({name:e.componentName||e.displayName,nativeTag:e.nativeTag,renderCount:e.renderCount,history:e.renderHistory?.map(e=>({n:e.renderNumber,t:e.timestamp,cause:{type:e.cause.type,componentCause:e.cause.componentCause,changedKeys:e.cause.changedKeys,parentComponentName:e.cause.parentComponentName,hookChanges:e.cause.hookChanges?.map(e=>({type:e.type,index:e.index,desc:e.description}))}}))}))}export function generateExport(e,n){const t=buildReport(e,n);switch(n.format){case"summary":default:return generateSummary(t,n);case"markdown-table":return generateMarkdownTable(t,n);case"json":return generateJson(e,t,n)}}export function estimateExportSize(e,n){return generateExport(e,n).length}export function getExportSummary(e){return{totalComponents:e.length,totalRenders:e.reduce((e,n)=>e+n.renderCount,0)}}export function generateSingleComponentExport(e){return generateExport([e],{format:"summary",topN:-1,minRenders:1,filterCauses:[],groupByName:!1,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1})}
|