跳至正文

验证依据

体积、速度或无障碍指标未达标时,下列门禁会阻止发布。本站的每个数值都来自这些门禁。

CI门禁

门禁目标
Gzip压缩后的包体积.size-limit.json中按组件设置的上限
Tier 0客户端JavaScript0 kB——不得调用任何React Hook
禁用JavaScript的测试套件Tier 0完整通过;Tier 1/2满足文档约定的降级契约
Axe违规数Chromium、Firefox和WebKit中均为0
库引发的强制布局交互跟踪中为0 ms
交互延迟≤ 200 ms,4× CPU限速(Chromium)
渲染次数每次交互≤ 2次React提交
Lighthouse(文档路由)性能≥ 0.95,无障碍1.00
Core Web VitalsLCP ≤ 2500 ms,CLS ≤ 0.1,TBT ≤ 200 ms

本地验证

npm run check:layout-reads    # banned geometry reads in packages
npm run checks                  # format, lint, typecheck, unit tests
npx playwright test --config=e2e/playwright-performance.config.ts
npm run bench                   # Radix comparison (local, not CI)

Tier 0组件还必须通过禁用JavaScript的测试套件(npm run test:no-js)。查看分级

无障碍

  • axe-core——使用Playwright,在Chromium、Firefox和WebKit中检查带样式的测试路由及每个公开文档页面,违规数须为零。
  • 遵循APG——ARIA复合控件遵循WAI-ARIA创作实践。

查看无障碍

Radix基准测试报告

在仓库根目录运行npm run bench生成。同一套交互脚本驱动两个宿主;绝对数值仅代表实验室测量结果。

Performance Benchmark: uiify/components vs Radix UI

Methodology

  • Hardware: Apple M4 · darwin 25.5.0 · 16.0 GB RAM
  • Node: v24.18.0
  • uiify version: 0.0.0
  • Radix version: 2.3.7
  • Date: 2026-09-11
  • Warmup: 5 iterations (discarded)
  • Recorded: 50 iterations per metric
  • Trim: top/bottom 5%
  • Statistics: mean, stddev (median in results/*.json)
  • Hosts: uiify via apps/site /components/[slug]/test?profiler=true&controls=false (Next.js prod build); Radix via

benchmarks/app (Vite prod build, vite preview)

  • Headed Chromium, workers: 1, CPU throttle = 1 (raw rendering)

Results

React Commit Duration (ms) — lower is better

Componentuiify mean ± σRadix mean ± σΔ (uiify vs Radix)
select0.00 ± 0.000.00 ± 0.00—

Interaction FPS (fps) — higher is better

Componentuiify mean ± σRadix mean ± σΔ (uiify vs Radix)
select59.62 ± 4.1259.64 ± 2.92-0.0%

Forced Style/Layout (ms) — lower is better

Componentuiify mean ± σRadix mean ± σΔ (uiify vs Radix)
select0.00 ± 0.000.15 ± 0.03-100.0%

Heap After GC (MB) — lower is better

Componentuiify mean ± σRadix mean ± σΔ (uiify vs Radix)
select13.62 ± 3.1011.43 ± 3.10+19.2%

Bundle Size (kB, gzipped)

ComponentuiifyRadix
select0.0533.91

Notes

  • All measurements on headed Chrome (full GPU pipeline).
  • Variance reflects OS scheduler, GC, and browser internals.
  • The two hosts differ (Next.js SSR+hydration vs a standalone client app); both

are production builds driven by the same harness and BenchProfiler, but absolute numbers are lab-only and field behavior may differ.

  • Forced style/layout is measured in ms via the e2e CDP trace pipeline

(analyzeForcedLayout).

本页由机器翻译,尚未经人工审核。