[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6JCPDHNXTW2DWB13DPN4RRX":3,"skill-same:01M6JCPDHNXTW2DWB13DPN4RRX":57},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":22,"publishedAt":29,"linkOnly":30,"markdownContent":31,"markdownBody":32,"frontMatter":33,"refName":35,"commitSha":36,"skillDirectory":37,"forksCount":38,"repositoryHtmlUrl":39,"repositoryHomepageUrl":40,"ownerHtmlUrl":41,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":42,"install":43,"resources":56},"01M6JCPDHNXTW2DWB13DPN4RRX","benchmark",null,"Use this skill to measure performance baselines, detect regressions before\u002Fafter PRs, and compare stack alternatives.","S3YED\u002Fappie-kit","S3YED","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F62743867?v=4","01M6JBKBRRVP6KMS0VWZ27T3R6","01M6JBKBX0KG30284PW1DBYJT1",14,"MIT","https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit\u002Fblob\u002Fmaster\u002Fskills\u002Fecc\u002Fbenchmark\u002FSKILL.md",[17],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000023","Skill与智能体开发","SCENARIO","使用场景",[5,23,24,25,26,27,28],"performance","stack","use","compare","detect","alternatives","2026-11-10 10:12:30",false,"---\nname: benchmark\ndescription: Use this skill to measure performance baselines, detect regressions before\u002Fafter PRs, and compare stack alternatives.\norigin: ECC\n---\n\n# Benchmark — Performance Baseline & Regression Detection\n\n## When to Use\n\n- Before and after a PR to measure performance impact\n- Setting up performance baselines for a project\n- When users report \"it feels slow\"\n- Before a launch — ensure you meet performance targets\n- Comparing your stack against alternatives\n\n## How It Works\n\n### Mode 1: Page Performance\n\nMeasures real browser metrics via browser MCP:\n\n```\n1. Navigate to each target URL\n2. Measure Core Web Vitals:\n   - LCP (Largest Contentful Paint) — target \u003C 2.5s\n   - CLS (Cumulative Layout Shift) — target \u003C 0.1\n   - INP (Interaction to Next Paint) — target \u003C 200ms\n   - FCP (First Contentful Paint) — target \u003C 1.8s\n   - TTFB (Time to First Byte) — target \u003C 800ms\n3. Measure resource sizes:\n   - Total page weight (target \u003C 1MB)\n   - JS bundle size (target \u003C 200KB gzipped)\n   - CSS size\n   - Image weight\n   - Third-party script weight\n4. Count network requests\n5. Check for render-blocking resources\n```\n\n### Mode 2: API Performance\n\nBenchmarks API endpoints:\n\n```\n1. Hit each endpoint 100 times\n2. Measure: p50, p95, p99 latency\n3. Track: response size, status codes\n4. Test under load: 10 concurrent requests\n5. Compare against SLA targets\n```\n\n### Mode 3: Build Performance\n\nMeasures development feedback loop:\n\n```\n1. Cold build time\n2. Hot reload time (HMR)\n3. Test suite duration\n4. TypeScript check time\n5. Lint time\n6. Docker build time\n```\n\n### Mode 4: Before\u002FAfter Comparison\n\nRun before and after a change to measure impact:\n\n```\n\u002Fbenchmark baseline    # saves current metrics\n# ... make changes ...\n\u002Fbenchmark compare     # compares against baseline\n```\n\nOutput:\n```\n| Metric | Before | After | Delta | Verdict |\n|--------|--------|-------|-------|---------|\n| LCP | 1.2s | 1.4s | +200ms | WARNING: WARN |\n| Bundle | 180KB | 175KB | -5KB | ✓ BETTER |\n| Build | 12s | 14s | +2s | WARNING: WARN |\n```\n\n## Output\n\nStores baselines in `.ecc\u002Fbenchmarks\u002F` as JSON. Git-tracked so the team shares baselines.\n\n## Integration\n\n- CI: run `\u002Fbenchmark compare` on every PR\n- Pair with `\u002Fcanary-watch` for post-deploy monitoring\n- Pair with `\u002Fbrowser-qa` for full pre-ship checklist\n","# Benchmark — Performance Baseline & Regression Detection\n\n## When to Use\n\n- Before and after a PR to measure performance impact\n- Setting up performance baselines for a project\n- When users report \"it feels slow\"\n- Before a launch — ensure you meet performance targets\n- Comparing your stack against alternatives\n\n## How It Works\n\n### Mode 1: Page Performance\n\nMeasures real browser metrics via browser MCP:\n\n```\n1. Navigate to each target URL\n2. Measure Core Web Vitals:\n   - LCP (Largest Contentful Paint) — target \u003C 2.5s\n   - CLS (Cumulative Layout Shift) — target \u003C 0.1\n   - INP (Interaction to Next Paint) — target \u003C 200ms\n   - FCP (First Contentful Paint) — target \u003C 1.8s\n   - TTFB (Time to First Byte) — target \u003C 800ms\n3. Measure resource sizes:\n   - Total page weight (target \u003C 1MB)\n   - JS bundle size (target \u003C 200KB gzipped)\n   - CSS size\n   - Image weight\n   - Third-party script weight\n4. Count network requests\n5. Check for render-blocking resources\n```\n\n### Mode 2: API Performance\n\nBenchmarks API endpoints:\n\n```\n1. Hit each endpoint 100 times\n2. Measure: p50, p95, p99 latency\n3. Track: response size, status codes\n4. Test under load: 10 concurrent requests\n5. Compare against SLA targets\n```\n\n### Mode 3: Build Performance\n\nMeasures development feedback loop:\n\n```\n1. Cold build time\n2. Hot reload time (HMR)\n3. Test suite duration\n4. TypeScript check time\n5. Lint time\n6. Docker build time\n```\n\n### Mode 4: Before\u002FAfter Comparison\n\nRun before and after a change to measure impact:\n\n```\n\u002Fbenchmark baseline    # saves current metrics\n# ... make changes ...\n\u002Fbenchmark compare     # compares against baseline\n```\n\nOutput:\n```\n| Metric | Before | After | Delta | Verdict |\n|--------|--------|-------|-------|---------|\n| LCP | 1.2s | 1.4s | +200ms | WARNING: WARN |\n| Bundle | 180KB | 175KB | -5KB | ✓ BETTER |\n| Build | 12s | 14s | +2s | WARNING: WARN |\n```\n\n## Output\n\nStores baselines in `.ecc\u002Fbenchmarks\u002F` as JSON. Git-tracked so the team shares baselines.\n\n## Integration\n\n- CI: run `\u002Fbenchmark compare` on every PR\n- Pair with `\u002Fcanary-watch` for post-deploy monitoring\n- Pair with `\u002Fbrowser-qa` for full pre-ship checklist\n",{"name":5,"origin":34,"description":7},"ECC","master","8ec37df6d71fb664ea19d32c079e7d3ff931a8e0","skills\u002Fecc\u002Fbenchmark",3,"https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit","https:\u002F\u002Fweblyfe.ai","https:\u002F\u002Fgithub.com\u002FS3YED","2026-08-27 01:54:02",{"source":8,"skillName":5,"commands":44,"prompt":54,"zipAvailable":55},[45,48,51],{"tool":46,"command":47},"npx","npx skills add S3YED\u002Fappie-kit --skill benchmark",{"tool":49,"command":50},"bunx","bunx skills add S3YED\u002Fappie-kit --skill benchmark",{"tool":52,"command":53},"pnpm","pnpm dlx skills add S3YED\u002Fappie-kit --skill benchmark","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit\u002Fblob\u002Fmaster\u002Fskills\u002Fecc\u002Fbenchmark\u002FSKILL.md",true,[],[58,90,125,151,182,207],{"skillNo":59,"name":60,"nameZh":6,"description":61,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":62,"categories":63,"keywords":71,"publishedAt":29},"01M6JFD4M6N4DSGC7TXEJ5R3J2","ai-music","AI music generation and audio tools: HeartMuLa lyrics-to-music generation, songwriting craft (+ Suno prompts), and audio spectrogram\u002Ffeature visualization.","https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit\u002Fblob\u002Fmaster\u002Fskills\u002Fwethlete\u002Fai-music\u002FSKILL.md",[64,67,70],{"categoryNo":65,"categoryName":66,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000013","分析与可视化",{"categoryNo":68,"categoryName":69,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000016","图像与多媒体",{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},[72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89],"music","ai music","humanizer","visualization","Tools","Audio","hermes","hermes agent","songwriting","suno","lyrics","prompts","heartmula","craft","generation","feature","ai music generation","music generation",{"skillNo":91,"name":92,"nameZh":6,"description":93,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":94,"categories":95,"keywords":104,"publishedAt":29},"01M6JFCZE4XNFQFMNZDHKHT5V5","agentic-webdesign-design-system-ingestion","Use v0 Design Systems 2.0, Bolt Design System Agents, or Lovable to generate production UI from a client's real design system components — not generic Tailwind. Use when building a client website where brand consistency matters.","https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit\u002Fblob\u002Fmaster\u002Fskills\u002Fweb-design\u002Fagentic-webdesign-design-system-ingestion\u002FSKILL.md",[96,99],{"categoryNo":97,"categoryName":98,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000015","视觉设计",{"categoryNo":100,"categoryName":101,"taxonomyType":102,"taxonomyTypeDesc":103},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124],"design","agentic","design system","system","ingestion","webdesign","agentic webdesign design system ingestion","components","generate","design systems","website","ui","Tailwind","bolt","lovable","v0","design-system","wed","design system components","appie",{"skillNo":126,"name":127,"nameZh":6,"description":128,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":129,"categories":130,"keywords":133,"publishedAt":29},"01M6JFCVPX3913CFAS6QQJ33ZB","agentic-webdesign-agent-elements","Use 21st.dev Agent Elements — 25 shadcn\u002Fui components purpose-built for AI agent UIs. Tool cards (Bash, Edit, Search, Plan, Subagent, MCP), chat, input, streaming. Open source, shadcn-registry install, no runtime lock-in.","https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit\u002Fblob\u002Fmaster\u002Fskills\u002Fweb-design\u002Fagentic-webdesign-agent-elements\u002FSKILL.md",[131,132],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},{"categoryNo":100,"categoryName":101,"taxonomyType":102,"taxonomyTypeDesc":103},[106,134,110,135,136,137,112,138,139,140,141,142,143,144,145,146,147,148,149,150],"elements","agentic webdesign agent elements","MCP","ai agent","registry","search","streaming","open source","open","Bash","plan","subagent","edit","install","input","lock","source",{"skillNo":152,"name":153,"nameZh":6,"description":154,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":155,"categories":156,"keywords":161,"publishedAt":29},"01M6JFCQC7H65M9QJ6TRE71BS1","vercel-deployment","Deploy static sites and frontends to Vercel — handles both CLI and REST API paths, including the CLI token sanitization workaround.","https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit\u002Fblob\u002Fmaster\u002Fskills\u002Fsoftware-development\u002Fvercel-deployment\u002FSKILL.md",[157,160],{"categoryNo":158,"categoryName":159,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000011","运维与部署",{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},[162,163,164,165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181],"deployment","vercel deployment","vercel","macos","cli","linux","windows","deploy","vercel deploy","REST","api","site","deploy to vercel","token","rest api","host","sites","paths","sanitization","static site",{"skillNo":183,"name":184,"nameZh":6,"description":185,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":186,"categories":187,"keywords":189,"publishedAt":29},"01M6JFCM4SMTXBM5A01BK2YQG1","software-quality-workflows","Umbrella workflow for TDD, debugging, code simplification, spikes, pre-commit review, and debugger-assisted investigation.","https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit\u002Fblob\u002Fmaster\u002Fskills\u002Fsoftware-development\u002Fsoftware-quality-workflows\u002FSKILL.md",[188],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},[190,191,192,193,194,195,196,197,198,199,200,201,202,203,204,205,206],"workflows","quality","software","software quality workflows","review","tdd","workflow","commit","debugging","code","debugger","pre-commit","investigation","code simplification","user","simplification","for",{"skillNo":208,"name":209,"nameZh":6,"description":210,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":211,"categories":212,"keywords":220,"publishedAt":29},"01M6JFCGD0M6CEATY01W7YN6DB","react-component-refactoring","Safely refactor large React components into smaller, maintainable pieces using proven patterns","https:\u002F\u002Fgithub.com\u002FS3YED\u002Fappie-kit\u002Fblob\u002Fmaster\u002Fskills\u002Fsoftware-development\u002Freact-component-refactoring\u002FSKILL.md",[213,216,219],{"categoryNo":214,"categoryName":215,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000007","代码审查",{"categoryNo":217,"categoryName":218,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000009","前端开发",{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},[221,222,223,224,225,226,227,228,165,229,230,112,231,168,232,199,233,234,235,236],"react","component","refactoring","component refactoring","react component","react component refactoring","frontend","writing","safe","typescript","react components","modular","refactor","simplify","patterns","test-driven-development"]