Files
gui/apps/kitchen-sink/tests/StressPagePerf.test.tsx
zeekayandHanzo Dev 69c6e860d7 transplant onto tamagui v2.6.0, brand as a re-runnable transform
This repo could never sync. There was NO merge-base with tamagui — 372 commits
here against 15,791 there, unrelated histories — because it began as a
copy-paste rebrand with a flattened layout. Every "sync" since was a hand
re-application that drifted, which is why the tree sat on 7.3.1 while upstream
shipped fixes we then rediscovered by hand.

This commit's PARENT IS TAMAGUI. A future sync is `git merge tama/main` then
`node scripts/rebrand.mjs` — a real merge, because the history is now shared.

174 packages: 166 upstream, our 8 restored (chrome, shell, telemetry, recipes,
get, font-geist-{sans,mono}, @hanzo/booker), bento-get gained. 170/170 build.

Our patches to files UPSTREAM ALSO OWNS are carried, which the package-level
delta missed and which was where the value actually was:
  - useMedia's server snapshot (`initState ?? getMedia()`). Upstream still
    returns undefined there, so every Tamagui Dialog kills a prerender — the
    exact crash hanzo.app spent a day on.
  - data-slot on web host nodes, absent upstream entirely.
Both applied ONTO upstream's newer files (it rewrote useMedia +150/-63 and
createComponent +160/-55), marked `PATCH (ours, carried across the transplant)`.

Seven traps are encoded in scripts/rebrand.mjs, each found by a gate:
skip itself and lockfiles; special-case the double-branded names in BOTH scoped
and bare form; map path strings, not just paths; drop a level for the flattened
group; check disk rather than a stale index.

Rust build artifacts are NOT committed. An earlier draft of this commit swept
apps/desktop/src-tauri/target/debug in via `git add -A` — 3,859 files including
a 272MB .a, over GitHub's 100MB cap, so the push could never have landed. They
are gitignored now.

Co-Authored-By: Hanzo Dev <[email protected]>
2026-07-30 18:25:06 -07:00

77 lines
2.5 KiB
TypeScript

import { expect, test } from '@playwright/test'
import { setupPage } from './test-utils'
/**
* Performance profiling test for the StressPage.
*
* Measures render time of a diverse page with ~200+ Gui components.
* Captures both wall-clock render time (performance.mark/measure) and
* internal @hanzogui/timer breakdown (getSplitStyles, createComponent checkpoints).
*
* Run:
* npx playwright test tests/StressPagePerf.test.tsx --project=default
*/
const RUNS = 10
test('StressPage render profiling', async ({ page }) => {
const times: number[] = []
let lastBreakdown: Record<string, number> | null = null
for (let i = 0; i < RUNS; i++) {
await setupPage(page, {
name: 'StressPage',
type: 'useCase',
searchParams: { profile: 'true' },
})
await page.waitForFunction(() => (window as any).__PERF_RESULT__, {
timeout: 10_000,
})
const result = await page.evaluate(() => (window as any).__PERF_RESULT__)
times.push(result.renderMs)
if (result.breakdown) {
lastBreakdown = result.breakdown
}
}
const sorted = [...times].sort((a, b) => a - b)
const median = sorted[Math.floor(sorted.length / 2)]
const mean = Math.round((times.reduce((a, b) => a + b, 0) / times.length) * 10) / 10
const min = sorted[0]
const max = sorted[sorted.length - 1]
const trimmed = sorted.slice(1, -1)
const trimmedMean =
Math.round((trimmed.reduce((a, b) => a + b, 0) / trimmed.length) * 10) / 10
console.log(`\n=== StressPage Render Profile (${RUNS} runs) ===`)
console.log(` All: ${times.map((t) => t.toFixed(1) + 'ms').join(', ')}`)
console.log(` Mean: ${mean}ms | Trimmed Mean: ${trimmedMean}ms | Median: ${median}ms`)
console.log(` Min: ${min}ms | Max: ${max}ms`)
if (lastBreakdown) {
console.log(`\n --- Internal Breakdown (last run) ---`)
let propTotal = 0
const entries = Object.entries(lastBreakdown).filter(([k]) => !k.endsWith('(ignore)'))
const phases: [string, number][] = []
for (const [label, totalMs] of entries) {
if (label.startsWith('before-prop-')) {
propTotal += totalMs
} else {
phases.push([label, totalMs])
}
}
phases.push(['before-prop-* (all props)', propTotal])
phases.sort((a, b) => b[1] - a[1])
for (const [label, totalMs] of phases) {
if (totalMs < 0.05) continue
console.log(` ${label.padStart(35)} | ${totalMs.toFixed(1)}ms`)
}
}
console.log(`================================================\n`)
expect(median).toBeGreaterThan(0)
})