[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6CGCEYPXWD606HP7XF3N076":3,"skill-same:01M6CGCEYPXWD606HP7XF3N076":80},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":9,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":17,"publishedAt":32,"linkOnly":33,"markdownContent":34,"markdownBody":35,"frontMatter":36,"refName":38,"commitSha":39,"skillDirectory":40,"forksCount":41,"repositoryHtmlUrl":42,"repositoryHomepageUrl":6,"ownerHtmlUrl":43,"ownerBlogUrl":44,"ownerDescription":45,"updatedAt":46,"install":47,"resources":60},"01M6CGCEYPXWD606HP7XF3N076","extension-profiling",null,"Compare browser extension performance between branches using WDYR, React DevTools Profiler, and E2E benchmarks with statistical rigor.","MetaMask\u002Fskills","MetaMask","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F11744586?v=4","01M6CGATQAN8ZP8HWEZH2379WJ","01M6CGATVJDE1ZMSRM20CFJ5S8",25,"MIT","https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills\u002Fblob\u002Fmain\u002Fdomains\u002Fperformance\u002Fskills\u002Fextension-profiling\u002Fskill.md",[],[18,19,20,21,22,23,24,25,26,27,28,29,30,31],"profiling","extension profiling","extension","performance","react","browser","devtools","e2e","benchmarks","branches","compare","with","browser extension","profiler","2026-11-10 10:12:30",false,"---\nmaturity: experimental\nname: extension-profiling\ndescription: Compare browser extension performance between branches using WDYR, React DevTools Profiler, and E2E benchmarks with statistical rigor.\n---\n\n# Browser Extension Profiling\n\nMethodology for profiling and comparing extension performance across branches or commits.\n\n## When To Use\n\n- Validating that a refactor reduces unnecessary re-renders (needs before\u002Fafter comparison)\n- Establishing baseline metrics for a performance initiative\n- Investigating a reported UI slowdown in the extension\n\n## Do Not Use When\n\n- Single-run comparisons — statistical significance requires ≥10 runs per scenario\n- The change touches only non-render paths (background scripts, network with no UI impact)\n- Target behavior is server-side latency, not UI rendering\n\n## Workflow\n\n1. **Build both branches** on the same machine and Chrome version: `yarn build:test` for the E2E benchmarks, and a development build (`yarn start` or `yarn build:test:dev`) for the React DevTools Profiler. For a PR, build the PR's merge-base as the baseline, not main's tip. The merge-base is the build the PR actually changed.\n\n2. **WDYR profiling** (unnecessary re-render counts)\n   ```bash\n   ENABLE_WHY_DID_YOU_RENDER=true yarn start\n   ```\n   Flags to watch:\n   - `different objects that are equal by value` → object recreation\n   - `different functions with the same name` → callback recreation\n   - `props object itself changed but values equal` → parent cascade\n\n3. **React DevTools Profiler** for flame graphs and commit timings, on a development build. `yarn build:test` passes `--mode production`, which sets `NODE_ENV=production`, and React's production build records no profiling data.\n   ```bash\n   yarn devtools:react\n   ```\n\n4. **E2E benchmarks** for scenario durations\n   ```bash\n   yarn test:e2e:benchmark\n   ```\n\n5. **Collect ≥10 runs** per scenario. Discard top\u002Fbottom 10%. Report mean, median, stddev, p75, p95.\n\n6. **Effect size:** report the difference in the metric's own units alongside Cohen's d. Cohen's d is the difference divided by the benchmark's own spread, so the difference worth acting on comes from product impact, fixed before the runs.\n\n## Common Pitfalls\n\n| Mistake | Correct Approach |\n|---------|-----------------|\n| Running branches on different machines or Chrome versions | Same machine, same Chrome, no other apps running |\n| Pooling all runs including noisy late-session ones | Fix the primary analysis, and any rule for dropping a round, before the runs. Report per-round stats as sensitivity, with explicit round attribution |\n| Reporting absolute re-render counts without scenario context | Normalize per-action; cascade fixes show multiplied impact at root |\n| Skipping cache and state reset between runs | Clear browser cache, reset extension state for each run |\n\n## Pre-Profiling Checklist\n\n- [ ] Both branches built with `yarn build:test` (benchmarks) and a development build (React DevTools Profiler)\n- [ ] Same machine, same Chrome version\n- [ ] No other tabs or applications running\n- [ ] WDYR enabled: `ENABLE_WHY_DID_YOU_RENDER=true`\n- [ ] Cache and extension state cleared between runs\n- [ ] Wallet state sized for the scenario: `yarn start:with-state` runs `yarn start` with a generated fixture wallet (30 accounts by default). A null on an empty wallet is a fact about the fixture, not the code\n","# Browser Extension Profiling\n\nMethodology for profiling and comparing extension performance across branches or commits.\n\n## When To Use\n\n- Validating that a refactor reduces unnecessary re-renders (needs before\u002Fafter comparison)\n- Establishing baseline metrics for a performance initiative\n- Investigating a reported UI slowdown in the extension\n\n## Do Not Use When\n\n- Single-run comparisons — statistical significance requires ≥10 runs per scenario\n- The change touches only non-render paths (background scripts, network with no UI impact)\n- Target behavior is server-side latency, not UI rendering\n\n## Workflow\n\n1. **Build both branches** on the same machine and Chrome version: `yarn build:test` for the E2E benchmarks, and a development build (`yarn start` or `yarn build:test:dev`) for the React DevTools Profiler. For a PR, build the PR's merge-base as the baseline, not main's tip. The merge-base is the build the PR actually changed.\n\n2. **WDYR profiling** (unnecessary re-render counts)\n   ```bash\n   ENABLE_WHY_DID_YOU_RENDER=true yarn start\n   ```\n   Flags to watch:\n   - `different objects that are equal by value` → object recreation\n   - `different functions with the same name` → callback recreation\n   - `props object itself changed but values equal` → parent cascade\n\n3. **React DevTools Profiler** for flame graphs and commit timings, on a development build. `yarn build:test` passes `--mode production`, which sets `NODE_ENV=production`, and React's production build records no profiling data.\n   ```bash\n   yarn devtools:react\n   ```\n\n4. **E2E benchmarks** for scenario durations\n   ```bash\n   yarn test:e2e:benchmark\n   ```\n\n5. **Collect ≥10 runs** per scenario. Discard top\u002Fbottom 10%. Report mean, median, stddev, p75, p95.\n\n6. **Effect size:** report the difference in the metric's own units alongside Cohen's d. Cohen's d is the difference divided by the benchmark's own spread, so the difference worth acting on comes from product impact, fixed before the runs.\n\n## Common Pitfalls\n\n| Mistake | Correct Approach |\n|---------|-----------------|\n| Running branches on different machines or Chrome versions | Same machine, same Chrome, no other apps running |\n| Pooling all runs including noisy late-session ones | Fix the primary analysis, and any rule for dropping a round, before the runs. Report per-round stats as sensitivity, with explicit round attribution |\n| Reporting absolute re-render counts without scenario context | Normalize per-action; cascade fixes show multiplied impact at root |\n| Skipping cache and state reset between runs | Clear browser cache, reset extension state for each run |\n\n## Pre-Profiling Checklist\n\n- [ ] Both branches built with `yarn build:test` (benchmarks) and a development build (React DevTools Profiler)\n- [ ] Same machine, same Chrome version\n- [ ] No other tabs or applications running\n- [ ] WDYR enabled: `ENABLE_WHY_DID_YOU_RENDER=true`\n- [ ] Cache and extension state cleared between runs\n- [ ] Wallet state sized for the scenario: `yarn start:with-state` runs `yarn start` with a generated fixture wallet (30 accounts by default). A null on an empty wallet is a fact about the fixture, not the code\n",{"name":5,"maturity":37,"description":7},"experimental","main","a0ec29ada8d53edf5a3f24370bec058767157433","domains\u002Fperformance\u002Fskills\u002Fextension-profiling",11,"https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills","https:\u002F\u002Fgithub.com\u002FMetaMask","https:\u002F\u002Fmetamask.io","MetaMask brings Ethereum to your web browser","2026-11-14 02:01:03",{"source":8,"skillName":5,"commands":48,"prompt":58,"zipAvailable":59},[49,52,55],{"tool":50,"command":51},"npx","npx skills add MetaMask\u002Fskills --skill extension-profiling",{"tool":53,"command":54},"bunx","bunx skills add MetaMask\u002Fskills --skill extension-profiling",{"tool":56,"command":57},"pnpm","pnpm dlx skills add MetaMask\u002Fskills --skill extension-profiling","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills\u002Fblob\u002Fmain\u002Fdomains\u002Fperformance\u002Fskills\u002Fextension-profiling\u002Fskill.md",true,[61,67,72,76],{"path":62,"resourceType":63,"resourceTypeDesc":64,"sizeBytes":65,"sourceHtmlUrl":66},"agents\u002Fopenai.yaml","REFERENCE","参考文档",315,"https:\u002F\u002Fgithub.com\u002Fjiayaoqijia\u002Fcryptoskill\u002Fblob\u002Fmain\u002Fskills\u002Fmcp-servers\u002Fblockscout-run-integration-tests\u002Fagents\u002Fopenai.yaml",{"path":68,"resourceType":68,"resourceTypeDesc":69,"sizeBytes":70,"sourceHtmlUrl":71},"LICENSE","许可证",24890,"https:\u002F\u002Fgithub.com\u002Fjiayaoqijia\u002Fcryptoskill\u002Fblob\u002Fmain\u002Fskills\u002Fmcp-servers\u002Fblockscout-run-integration-tests\u002FLICENSE",{"path":73,"resourceType":63,"resourceTypeDesc":64,"sizeBytes":74,"sourceHtmlUrl":75},"SOURCE.md",360,"https:\u002F\u002Fgithub.com\u002Fjiayaoqijia\u002Fcryptoskill\u002Fblob\u002Fmain\u002Fskills\u002Fmcp-servers\u002Fblockscout-run-integration-tests\u002FSOURCE.md",{"path":77,"resourceType":63,"resourceTypeDesc":64,"sizeBytes":78,"sourceHtmlUrl":79},"TRUST.auto.yaml",2113,"https:\u002F\u002Fgithub.com\u002Fjiayaoqijia\u002Fcryptoskill\u002Fblob\u002Fmain\u002Fskills\u002Fmcp-servers\u002Fblockscout-run-integration-tests\u002FTRUST.auto.yaml",[81,105,124,131,169,194],{"skillNo":82,"name":83,"nameZh":6,"description":84,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":9,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":85,"categories":86,"keywords":87,"publishedAt":32},"01M70PKJH3WSTFMSA8VYQWNDW9","recipe-performance","Diagnose a specific MetaMask user flow's real-app performance and Sentry critical-user-flow telemetry with deterministic mm-harness recipes. Use for CUF boundaries, cold\u002Fwarm\u002Fbackground-resume behavior, latency regressions, lifecycle tags, duplicate or blocking network requests, long tasks, layout\u002Fpaint cost, screen redraws, React rerenders, or browser trace analysis where tests alone cannot prove the real app.","https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills\u002Fblob\u002Fmain\u002Fdomains\u002Fagentic\u002Fskills\u002Frecipe-performance\u002Fskill.md",[],[21,88,89,90,91,92,93,94,22,23,95,96,97,98,99,100,101,102,103,104],"recipe performance","recipe","app","cold","critical","analysis","tasks","layout","screen","network","metamask","flow","recipes","deterministic","harness","mm","sentry",{"skillNo":106,"name":107,"nameZh":6,"description":108,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":9,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":109,"categories":110,"keywords":111,"publishedAt":32},"01M6CGJ7AEJCZSRGF3PBE6EWBG","x402-payments","Build x402 payment flows using MetaMask Smart Accounts Kit, machine to machine payments over HTTP with ERC-7710 delegations and ERC-7715 Advanced Permissions","https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills\u002Fblob\u002Fmain\u002Fdomains\u002Fweb3-tools\u002Fskills\u002Fx402-payments\u002Fskill.md",[],[112,113,114,115,116,117,118,29,119,120,121,122,98,123],"payments","x402 payments","x402","permissions","smart accounts kit","http","build","payment","advanced","flows","machine","kit",{"skillNo":125,"name":126,"nameZh":6,"description":127,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":9,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":128,"categories":129,"keywords":130,"publishedAt":32},"01M6CGJ4AEKJZJWJ704SZTWQ5T","smart-accounts-kit","Build dApps with MetaMask Smart Accounts Kit — ERC-4337 smart accounts, delegations, and Advanced Permissions (ERC-7715)","https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills\u002Fblob\u002Fmain\u002Fdomains\u002Fweb3-tools\u002Fskills\u002Fsmart-accounts-kit\u002Fskill.md",[],[116,123,115,118,29,120,98],{"skillNo":132,"name":133,"nameZh":6,"description":134,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":9,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":135,"categories":136,"keywords":142,"publishedAt":32},"01M6CGJ11KGB6862Z1ADYTMKYZ","oh-my-opencode","Multi-agent orchestration plugin for OpenCode. Use when the user wants to install, configure, or operate oh-my-opencode — including agent delegation, ultrawork mode, Prometheus planning, background tasks, category-based task routing, model resolution, tmux integration, or any oh-my-opencode feature. Covers installation, configuration, all agents (Sisyphus, Oracle, Librarian, Explore, Atlas, Prometheus, Metis, Momus), all categories, slash commands, hooks, skills, MCPs, and troubleshooting.","https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills\u002Fblob\u002Fmain\u002Fdomains\u002Fweb3-tools\u002Fskills\u002Foh-my-opencode\u002Fskill.md",[137],{"categoryNo":138,"categoryName":139,"taxonomyType":140,"taxonomyTypeDesc":141},"01JBSEEDCAT000000000000023","Skill与智能体开发","SCENARIO","使用场景",[143,144,145,146,147,148,149,150,151,152,153,154,155,94,156,157,158,159,160,161,162,163,164,165,166,167,168],"opencode","oh my opencode","my","model","explore","hooks","delegation","librarian","agent orchestration","oracle","orchestration","configure","code","ultrawork","install","multi-agent","tmux","prometheus","planning","use","categories","operate","mode","metis","momus","when",{"skillNo":170,"name":171,"nameZh":6,"description":172,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":9,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":173,"categories":174,"keywords":175,"publishedAt":32},"01M6CGHY9SVTXK2DK18H794EHE","gator-cli","Use when you need to operate the @metamask\u002Fgator-cli to initialize profiles, upgrade EOA to EIP-7702, grant, redeem, and revoke ERC-7710 delegations, or inspect balances and delegations. Covers commands, required flags, grant scopes, redeem action types, configuration locations, and common usage flows.","https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills\u002Fblob\u002Fmain\u002Fdomains\u002Fweb3-tools\u002Fskills\u002Fgator-cli\u002Fskill.md",[],[176,177,178,179,180,157,181,162,182,183,184,164,185,186,187,188,121,189,123,190,168,191,192,193],"cli","gator cli","initialize","https","node","flags","docs","configuration","common","usage","types","balances","inspect","profiles","upgrade","you","io","commands",{"skillNo":195,"name":196,"nameZh":6,"description":197,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":9,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":198,"categories":199,"keywords":205,"publishedAt":32},"01M6CGHVB2A8SMD9X84ZTH9RHV","ui-development","UI component development standards for MetaMask clients: the strict design-system-first component hierarchy, availability checks before building custom components, styling with design tokens, and required imports. Use when building, restyling, or reviewing any UI component, or when choosing between a design-system, component-library, or custom component.","https:\u002F\u002Fgithub.com\u002FMetaMask\u002Fskills\u002Fblob\u002Fmain\u002Fdomains\u002Fui\u002Fskills\u002Fui-development\u002Fskill.md",[200],{"categoryNo":201,"categoryName":202,"taxonomyType":203,"taxonomyTypeDesc":204},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[206,207,208,209,210,211,212,213,214,215,216,217,218,162,219,220,221,222,223,224,225,226,168,29,227,228],"development","ui development","ui","standards","component","first","system","before building","ui component","design","design tokens","design-system","styling","library","components","availability","for","component development","tokens","custom","true","hierarchy","imports"]