web-perf
SkillAnalyzes web performance using Chrome DevTools MCP. Measures Core Web Vitals (LCP, INP, CLS) and supplementary metrics (FCP, TBT, Speed Index), identifies render-blocking resources, network dependency chains, layout shifts, caching issues, and accessibility gaps. Use when asked to audit, profile, de
Install
git clone https://github.com/cloudflare/skills.git ~/.claude/skills/web-perfWhat is web-perf?
Analyzes web performance using Chrome DevTools MCP. Measures Core Web Vitals (LCP, INP, CLS) and supplementary metrics (FCP, TBT, Speed Index), identifies render-blocking resources, network dependency chains, layout shifts, caching issues, and accessibility gaps. Use when asked to audit, profile, debug, or optimize page load performance, Lighthouse scores, or site speed. Biases towards retrieval from current documentation over pre-trained knowledge.
What this can do
Capabilities declared in this component's own frontmatter — not inferred.
Inherit all session tools
Declares no tool restrictions — inherits every session tool
~113 tokens of context used while enabled, before you invoke anything
Documentation
README · ~5 min readWeb Performance Audit
Your knowledge of web performance metrics, thresholds, and tooling APIs may be outdated. Prefer retrieval over pre-training when citing specific numbers or recommendations.
Retrieval Sources
| Source | How to retrieve | Use for |
|---|---|---|
| web.dev | https://web.dev/articles/vitals | Core Web Vitals thresholds, definitions |
| Chrome DevTools docs | https://developer.chrome.com/docs/devtools/performance | Tooling APIs, trace analysis |
| Lighthouse scoring | https://developer.chrome.com/docs/lighthouse/performance/performance-scoring | Score weights, metric thresholds |
FIRST: Verify MCP Tools Available
Run this before starting. Try calling navigate_page or performance_start_trace. If unavailable, STOP—the chrome-devtools MCP server isn't configured.
Reviews
Log in to leave a review.
No reviews yet — be the first.
Explore related
Other things in this space — across every part of the ecosystem, not just skills.
Skillssimilar to this one
All skills →ECC
The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.
235.3K stars
ui-ux-pro-max-skill
An AI SKILL that provide design intelligence for building professional UI/UX multiple platforms
111.3K stars
claude-mem
Persistent Context Across Sessions for Every Agent – Captures everything your agent does during sessions, compresses it with AI, and injects relevant context back into future sessions. Works with Claude Code, OpenClaw, Codex, Gemini, Hermes, Copilot, OpenCode + More
88.9K stars
MCP Servers
All mcp servers →context7
Context7 Platform -- Up-to-date code documentation for LLMs and AI code editors
60K stars
Figma-Context-MCP
MCP server to provide Figma layout information to AI coding agents like Cursor
15.5K stars
dbhub
Zero-dependency, token-efficient database MCP server for Postgres, MySQL, SQL Server, MariaDB, SQLite.
3.3K stars
Commands
All commands →feature-dev
Guided feature development with codebase understanding and architecture focus
32.8K stars
modernize-harden
Security vulnerability scan with a reviewable remediation patch — OWASP, CWE, CVE, secrets, injection
32.8K stars
modernize-transform
Transform one legacy module to the target stack — idiomatic rewrite with behavior-equivalence tests
32.8K stars
Subagents
All subagents →ECC
The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.
235.3K stars
architecture-critic
Reviews proposed target architectures and transformed code against modern best practice. Adversarial — looks for over-engineering, missed requirements, and simpler alternatives.
32.8K stars
code-architect
Designs feature architectures by analyzing existing codebase patterns and conventions, then providing comprehensive implementation blueprints with specific files to create/modify, component designs, data flows, and build sequences
32.8K stars
Plugins
All plugins →chrome-devtools-mcp
Control and inspect a live Chrome browser from your coding agent. Record performance traces, analyze network requests, check console messages with source-mapped stack traces, and automate browser actions with Puppeteer.
47.9K stars
claude-security
Deep vulnerability scanning of your own code, run entirely inside your Claude Code session at a chosen effort tier, with every finding challenged before it is reported and the verification tally computed in code. Turns surviving findings into targeted patches, each verified by a panel of agents, tha
32.9K stars
claude-md-management
Tools to maintain and improve CLAUDE.md files - audit quality, capture session learnings, and keep project memory current.
32.9K stars