From fd83c9cb641e5bf82468b3f33fffda99d4562216 Mon Sep 17 00:00:00 2001 From: syuilo <4439005+syuilo@users.noreply.github.com> Date: Thu, 16 Jul 2026 21:25:32 +0900 Subject: [PATCH] enhance(gh): tweak frontend-browser-diagnostics --- .../frontend-browser-diagnostics.inspect.mts | 35 ++++++++++--------- ...frontend-browser-diagnostics.render-md.mts | 11 +++--- .../frontend-browser-diagnostics.inspect.yml | 16 +++++++-- 3 files changed, 37 insertions(+), 25 deletions(-) diff --git a/.github/scripts/frontend-browser-diagnostics.inspect.mts b/.github/scripts/frontend-browser-diagnostics.inspect.mts index 545149df24..ec0e08857d 100644 --- a/.github/scripts/frontend-browser-diagnostics.inspect.mts +++ b/.github/scripts/frontend-browser-diagnostics.inspect.mts @@ -11,12 +11,15 @@ import { HeadlessChromeController, summarizeBrowserDiagnostics, summarizeNetwork import type { BrowserMeasurement, NetworkRequest, NetworkSummary } from './chrome.mts'; import { closeUserSetupDialog, postNote, signupThroughUi, visitHome } from '../../packages/frontend/test/e2e/shared.ts'; -const [baseDirArg, headDirArg, baseOutputArg, headOutputArg, headHeapSnapshotOutputArg] = process.argv.slice(2); +const [baseDirArg, headDirArg, baseOutputArg, headOutputArg, baseHeapSnapshotOutputArg, headHeapSnapshotOutputArg] = process.argv.slice(2); const baseUrl = process.env.FRONTEND_BROWSER_METRICS_URL ?? 'http://127.0.0.1:61812'; const sampleCount = util.readIntegerEnv('FRONTEND_BROWSER_METRICS_SAMPLE_COUNT', 5, 1); const heapSnapshotBreakdownTopN = util.readIntegerEnv('FRONTEND_BROWSER_HEAP_SNAPSHOT_BREAKDOWN_TOP_N', heapSnapshotUtil.defaultHeapSnapshotBreakdownTopN, 1); -const headHeapSnapshotWorkDir = resolve('frontend-browser-head-heap-snapshots'); +const heapSnapshotWorkDirs = { + base: resolve('frontend-browser-base-heap-snapshots'), + head: resolve('frontend-browser-head-heap-snapshots'), +} as const; type BrowserMeasurementSample = BrowserMeasurement & { round: number; @@ -223,28 +226,26 @@ async function measureSample(label: 'base' | 'head', round: number, heapSnapshot }); } -function headHeapSnapshotPath(round: number) { - return join(headHeapSnapshotWorkDir, `round-${round}.heapsnapshot`); +function heapSnapshotPath(label: 'base' | 'head', round: number) { + return join(heapSnapshotWorkDirs[label], `round-${round}.heapsnapshot`); } -async function saveRepresentativeHeadHeapSnapshot(report: BrowserMetricsReport, outputPath: string) { +async function saveRepresentativeHeapSnapshot(label: 'base' | 'head', report: BrowserMetricsReport, outputPath: string) { const representative = selectRepresentativeSample(report.samples, sample => sample.heapSnapshot.categories.total); - await copyFile(headHeapSnapshotPath(representative.round), outputPath); - process.stderr.write(`[head] Selected round ${representative.round} heap snapshot for artifact\n`); - await rm(headHeapSnapshotWorkDir, { recursive: true, force: true }); + await copyFile(heapSnapshotPath(label, representative.round), outputPath); + process.stderr.write(`[${label}] Selected round ${representative.round} heap snapshot for artifact\n`); + await rm(heapSnapshotWorkDirs[label], { recursive: true, force: true }); } -async function genReport(label: 'base' | 'head', repoDir: string, outputPath: string, heapSnapshotSavePath?: string) { +async function genReport(label: 'base' | 'head', repoDir: string, outputPath: string, heapSnapshotSavePath: string) { let server: ReturnType | null = null; try { server = util.startServer(label, repoDir); await util.waitForServer(baseUrl, server!); - if (label === 'head' && heapSnapshotSavePath != null) { - await rm(headHeapSnapshotWorkDir, { recursive: true, force: true }); - await mkdir(headHeapSnapshotWorkDir, { recursive: true }); - } + await rm(heapSnapshotWorkDirs[label], { recursive: true, force: true }); + await mkdir(heapSnapshotWorkDirs[label], { recursive: true }); const samples: BrowserMeasurementSample[] = []; for (let round = 1; round <= sampleCount; round++) { @@ -252,7 +253,7 @@ async function genReport(label: 'base' | 'head', repoDir: string, outputPath: st samples.push(await measureSample( label, round, - label === 'head' && heapSnapshotSavePath != null ? headHeapSnapshotPath(round) : undefined, + heapSnapshotPath(label, round), )); } @@ -260,8 +261,8 @@ async function genReport(label: 'base' | 'head', repoDir: string, outputPath: st await writeFile(outputPath, JSON.stringify(report, null, '\t')); process.stderr.write(`[${label}] Wrote browser metrics report to ${outputPath}\n`); - if (label === 'head' && heapSnapshotSavePath != null) { - await saveRepresentativeHeadHeapSnapshot(report, heapSnapshotSavePath); + if (heapSnapshotSavePath != null) { + await saveRepresentativeHeapSnapshot(label, report, heapSnapshotSavePath); } } finally { if (server != null) await util.stopServer(server); @@ -269,7 +270,7 @@ async function genReport(label: 'base' | 'head', repoDir: string, outputPath: st } async function main() { - await genReport('base', resolve(baseDirArg), resolve(baseOutputArg)); + await genReport('base', resolve(baseDirArg), resolve(baseOutputArg), resolve(baseHeapSnapshotOutputArg)); await genReport('head', resolve(headDirArg), resolve(headOutputArg), resolve(headHeapSnapshotOutputArg)); } diff --git a/.github/scripts/frontend-browser-diagnostics.render-md.mts b/.github/scripts/frontend-browser-diagnostics.render-md.mts index c18ef63f46..f0890e65ef 100644 --- a/.github/scripts/frontend-browser-diagnostics.render-md.mts +++ b/.github/scripts/frontend-browser-diagnostics.render-md.mts @@ -314,10 +314,10 @@ function toHeapSnapshotReport(report: BrowserMetricsReport): HeapSnapshotReport } function renderMd(base: BrowserMetricsReport, head: BrowserMetricsReport, options: { - headHeapSnapshotUrl?: string; + baseHeapSnapshotUrl: string; + headHeapSnapshotUrl: string; detailedHtmlUrl?: string; -} = {}) { - const headHeapSnapshotUrl = options.headHeapSnapshotUrl; +}) { const detailedHtmlUrl = options.detailedHtmlUrl; const heapSnapshotTable = heapSnapshotUtil.renderHeapSnapshotTable(toHeapSnapshotReport(base), toHeapSnapshotReport(head)); const lines = [ @@ -343,7 +343,7 @@ function renderMd(base: BrowserMetricsReport, head: BrowserMetricsReport, option '', heapSnapshotUtil.renderHeapSnapshotSankey(toHeapSnapshotReport(head), 'Head'), '', - `[Download representative head heap snapshot](${headHeapSnapshotUrl})`, + `Download representative heap snapshot: [base](${options.baseHeapSnapshotUrl}) / [head](${options.headHeapSnapshotUrl})`, '', '', ]; @@ -366,7 +366,8 @@ async function main() { const base = JSON.parse(await readFile(baseFile, 'utf8')) as BrowserMetricsReport; const head = JSON.parse(await readFile(headFile, 'utf8')) as BrowserMetricsReport; await writeFile(outputFile, renderMd(base, head, { - headHeapSnapshotUrl: process.env.FRONTEND_BROWSER_HEAD_HEAP_SNAPSHOT_ARTIFACT_URL, + baseHeapSnapshotUrl: process.env.FRONTEND_BROWSER_BASE_HEAP_SNAPSHOT_ARTIFACT_URL!, + headHeapSnapshotUrl: process.env.FRONTEND_BROWSER_HEAD_HEAP_SNAPSHOT_ARTIFACT_URL!, detailedHtmlUrl: process.env.FRONTEND_BROWSER_DETAILED_HTML_ARTIFACT_URL, })); } diff --git a/.github/workflows/frontend-browser-diagnostics.inspect.yml b/.github/workflows/frontend-browser-diagnostics.inspect.yml index 444c54040b..76af11bec6 100644 --- a/.github/workflows/frontend-browser-diagnostics.inspect.yml +++ b/.github/workflows/frontend-browser-diagnostics.inspect.yml @@ -127,14 +127,23 @@ jobs: run: | REPORT_DIR="$RUNNER_TEMP/frontend-browser-diagnostics" mkdir -p "$REPORT_DIR" - node after/.github/scripts/frontend-browser-diagnostics.inspect.mts before after "$REPORT_DIR/before-browser.json" "$REPORT_DIR/after-browser.json" "$REPORT_DIR/head-heap-snapshot.heapsnapshot" + node after/.github/scripts/frontend-browser-diagnostics.inspect.mts before after "$REPORT_DIR/before-browser.json" "$REPORT_DIR/after-browser.json" "$REPORT_DIR/base-heap-snapshot.heapsnapshot" "$REPORT_DIR/head-heap-snapshot.heapsnapshot" + + - name: Upload browser base heap snapshot + id: upload-browser-base-heap-snapshot + uses: actions/upload-artifact@v7 + with: + path: base-heap-snapshot.heapsnapshot + archive: false + if-no-files-found: error + retention-days: 7 - name: Upload browser head heap snapshot id: upload-browser-head-heap-snapshot uses: actions/upload-artifact@v7 with: - name: frontend-browser-metrics-head-heap-snapshot - path: ${{ runner.temp }}/frontend-browser-diagnostics/head-heap-snapshot.heapsnapshot + path: head-heap-snapshot.heapsnapshot + archive: false if-no-files-found: error retention-days: 7 @@ -162,6 +171,7 @@ jobs: BASE_SHA: ${{ github.event.pull_request.base.sha }} HEAD_SHA: ${{ github.event.pull_request.head.sha }} PR_NUMBER: ${{ github.event.pull_request.number }} + FRONTEND_BROWSER_BASE_HEAP_SNAPSHOT_ARTIFACT_URL: ${{ steps.upload-browser-base-heap-snapshot.outputs.artifact-url }} FRONTEND_BROWSER_HEAD_HEAP_SNAPSHOT_ARTIFACT_URL: ${{ steps.upload-browser-head-heap-snapshot.outputs.artifact-url }} FRONTEND_BROWSER_DETAILED_HTML_ARTIFACT_URL: ${{ steps.upload-browser-detailed-html.outputs.artifact-url }} run: |