performance

用途：让 UI 更快更稳，把性能视为可访问性问题，因为卡顿界面会先在低端设备上失效。主要能力与流程：先读取 .claude/skills/_ux-ui-shared/workflows/performance.md，其中包含 Core Web Vitals 目标、加载策略、布局偏移、动画性能、设计系统运行时成本。按预算诊断：LCP ≤ 2.5s、INP ≤ 200ms、CLS ≤ 0.1，在中等移动档位测量（限速 slow 4G 加 4 倍 CPU）。加载方面：优先渲染首屏（SSR / Server Components），按路由与重组件做代码分割，首屏以下或交互后才出现的部分懒加载（Astro islands / Qwik），预加载一个关键字体字重，使用现代响应式图片。消除布局偏移：骨架屏按最终尺寸设定，用 aspect-ratio 预留媒体空间（.claude/skills/_ux-ui-shared/tokens/sizing.json），不要在上方插入内容。动画：只用 transform 与 opacity，谨慎使用 will-change，时长 100–300ms（.claude/skills/_ux-ui-shared/tokens/motion.json），尊重 prefers-reduced-motion；低 INP 场景优先用 CSS 状态样式替代 JS，做 tree-shake 与按组件导入。验收标准：Lighthouse 或字段数据在中等移动设备上达到上述三项指标；slow 4G 加 4 倍 CPU 限速下首次交互仍保持响应；骨架屏与媒体预留空间（加载零 CLS）；循环中无合成器之外动画。限制：资料未提供收费、价格、平台或效果保证，亦未给出完整使用步骤之外的安装命令，相关信息暂未提供。