Add Performance skills

[nucliweb]

Is your feature request related to a problem? Please describe.

Currently, performance analysis via LLMs can be inconsistent. When a model is asked to measure performance, it often generates code on the fly, leading to:

1. Non-deterministic results: Different code for the same metric (e.g., LCP or CLS).
2. High token consumption: Generating and sending large blocks of JavaScript via Runtime.evaluate.
3. Hallucinations: Inaccurate ways of accessing the Performance API or observing entries.

Following the pattern of Addy Osmani's web-quality-skills, I propose a dedicated performance skill set for this MCP.

Describe the solution you'd like

The approach uses curated scripts instead of raw code generation:

• Deterministic Output: The model calls a skill (e.g., get_core_web_vitals) which executes a known, reliable script.
• Token Optimization: Only the results are passed back to the model, saving the cost of generating the code itself.
• CDP Integration: Leveraging Runtime.evaluate to execute these snippets and return structured JSON.

User Stories / Examples

Scenario 1: General performance audit

• User Prompt: "Analyze the performance of the current page."
• MCP Action: The model calls the performance meta-skill, which triggers core-web-vitals and loading.
• Result: The model receives a structured JSON with precise metrics and provides a grounded recommendation.

Scenario 2: Debugging interactions

• User Prompt: "Why is this page feeling laggy when I click buttons?"
• MCP Action: The model calls performance:interaction to check for Long Animation Frames or high INP.

Describe alternatives you've considered

.

Additional context

I have already migrated these snippets to a skill-based architecture in my project. I believe adapting and optimizing these for the Chrome DevTools MCP would significantly enhance its capabilities for web performance engineers.

I'm happy to provide a PR with the initial folder structure and the first set of core scripts if the maintainers agree with this direction.

[natorion]

Relevant pull request: #1106

[natorion]

Thank you @nucliweb . As discussed over DM I suggest the following plan of action:

• Every skill carries a token cost, I think we probably only want a meta-performance-debugging skill, that is loaded to the default context window if needed, and that meta skill then references the sub skills that are in this case discovered and loaded.
• Let's make sure this uses the existing devtools mcp tools for effect.
• We should start moving over one skill after another - probably?
• Claude code's skill-creator als includes having evals ... probably worth it to also run through it.

@devnook @matthiasrohmer maybe one of you or Barry could shepherd this, as you folks are deeper in the topic of performance debugging?

[nucliweb]

Implementation plan

Based on the skills available in nucliweb/webperf-snippets, here's the full set to implement:

Skills ToDo

• webperf-core-web-vitals LCP, CLS, INP + 4 LCP diagnostic scripts → PR feat: add webperf-core-web-vitals skill #1198
• webperf-loading +10 scripts: TTFB, FCP, render-blocking, fonts, resource hints, service worker, SSR hydration…
• webperf-interaction 8 scripts: Interactions, INP deep-dive, Long Animation Frames + attribution, scroll jank, long tasks
• webperf-media 3 scripts: image audit, video audit, SVG embedded bitmap detection
• webperf-resources 1 script: network bandwidth / connection quality (adaptive loading)
• webperf — meta-skill that references all sub-skills and routes queries to the right one

Notes on implementation approach

• Script source: readable source files from /snippets/ rather than the minified build output in /skills/
• Minification tradeoff: upstream uses Terser to minify for token optimization; we're starting unminified for maintainability — can add a build step later if needed
• INP pattern: tracking scripts (INP and others in webperf-interaction) require the agent to pause, inform the user to interact with the page, and wait for confirmation before collecting results
• Token cost: as noted in the discussion, a lean webperf meta-skill should load sub-skills on demand rather than loading all of them upfront

[natorion]

@tunetheweb will help shepherding this along.