菜单
Use when the app feels slow, bundle is large, or optimizing LCP, INP, CLS, images, or unnecessary re-renders. Not for SEO copy or accessibility-only passes.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Use when reviewing or fixing accessibility: keyboard navigation, focus order, labels, color contrast, screen reader support, or ARIA attributes. Not for SEO-only or performance-only audits.
Use when adding product analytics (PostHog, GA4, Plausible), event tracking, funnels, or conversion measurement. Not for server logs only or A/B infra unless events are part of the task.
Use when standardizing API and edge function errors: HTTP status codes, error JSON shape, logging, or mapping Supabase/Stripe errors to client responses. Not for UI toast copy only or form field validation messages.
Use when recording audit trails: who changed what, admin action logs, compliance history, or append-only event tables. Not for product analytics (use analytics-events) or debug console logs only.
Use when scheduling background work: cron jobs, digest emails, cleanup tasks, pg_cron, Supabase scheduled edge functions, or job queues. Not for synchronous user-facing API in the request path.
Use when adding dark mode, theme toggle, system theme support, or fixing hardcoded colors that break in dark mode. Not for design-token migration unrelated to dark mode.
| name | performance-budget |
| description | Use when the app feels slow, bundle is large, or optimizing LCP, INP, CLS, images, or unnecessary re-renders. Not for SEO copy or accessibility-only passes. |
Identify: LCP element, large JS chunks, N+1 network, layout shift sources.
width/height or aspect ratio to prevent CLS.typed-api-hooks-forms / tanstack-query-alternative).select over many parallel hooks on same screen.useMemo everywhere.React.lazy + Suspense for heavy admin sections.List findings: issue | impact (high/med/low) | recommended fix.