Skip to content
mcp/skillhub

Agent Skill

Performance Optimization skill

performance-optimizationaddyosmani/agent-skillsskills/performance-optimization/SKILL.md

Optimizes application performance across frontend, backend, queries, and databases. Use when performance requirements exist, when you suspect performance regressions, when Core Web Vitals or load times need improvement, when N+1 query patterns need fixing, or when profiling reveals bottlenecks.

109kMIT

always on

59 tokname + description

once used

3,739 tokSKILL.md body

bundled files

19 KB

installs

62kskills.sh

Install the Performance Optimization skill

Skills CLI (Claude Code, Codex, Cursor and others)

npx skills add https://github.com/addyosmani/agent-skills --skill performance-optimization

Claude Code, by hand (all projects)

git clone --depth 1 https://github.com/addyosmani/agent-skills.git /tmp/agent-skills
mkdir -p ~/.claude/skills
cp -R /tmp/agent-skills/skills/performance-optimization ~/.claude/skills/performance-optimization

For one project only, copy the folder into .claude/skills/ in that project instead. The agent picks it up when a task matches its description.

What it costs your context

Agent Skills load in three steps. Tokens counted with the o200k tokenizer; your model's count will differ a little.

WhenWhat loadsCost
Every sessionName and description59 tok
When the agent uses itThe SKILL.md instructions3,739 tok
Only if opened1 bundled files (9 KB)varies

Until it is used, performance-optimization costs about 23× less than the median MCP server we measured (1,362 tokens on every turn). Installing all 25 skills from addyosmani/agent-skills would load 1,829 tokens of descriptions. Skills vs MCP study

Checks

Our checks found nothing to flag: it follows the Agent Skills specification's naming and size guidelines and doesn't pipe downloads into a shell.

Checked 2026-10-22 · method

What's inside

The headings of its SKILL.md. Read the full file on GitHub.

  • Performance Optimization
  • Overview
  • When to Use
  • Core Web Vitals Targets
  • The Optimization Workflow
  • Step 1: Measure
  • Where to Start Measuring
  • Step 2: Identify the Bottleneck
  • Step 3: Fix the Bottleneck
  • Step 4: Verify (Keep or Revert)
  • Step 5: Guard Against Regression
  • See Also
  • Common Rationalizations
  • Red Flags
  • Verification

More skills from addyosmani/agent-skills

All skills in this repo
  1. code-review-and-qualityaddyosmani/agent-skills

    Conducts multi-axis code review. Use before merging any change. Use when reviewing code written by yourself, another agent, or a human. Use when you need to assess code quality across multiple dimensions before it enters the main branch. Use when asked to review a diff or a pull request, even when the diff is pasted inline.

    70k71 tok idle · 4,375 in use
  2. security-and-hardeningaddyosmani/agent-skills

    Hardens code against vulnerabilities. Use when auditing an input handler for vulnerabilities, when handling user input, authentication, data storage, or external integrations, or when checking a login flow is safe against the OWASP Top Ten. Use when building any feature that accepts untrusted data, manages user sessions, or interacts with third-party services. Use when auditing dependencies for known vulnerabilities, triaging package-manager audit findings, or assessing supply-chain risk in a new package. Use when personal data or privacy compliance (GDPR, CCPA) is involved.

    67k113 tok idle · 3,744 in use
  3. frontend-ui-engineeringaddyosmani/agent-skills

    Builds production-quality, accessible, responsive user-facing UIs. Use when building or modifying interfaces and pages, creating components, implementing layouts, meeting WCAG accessibility requirements, managing state, or when the output needs to look and feel production-quality rather than AI-generated.

    64k57 tok idle · 2,676 in use
  4. spec-driven-developmentaddyosmani/agent-skills

    Creates specs before coding. Use when starting a new project, feature, or significant change and no specification exists yet. Use when drafting a PRD or requirements document with objectives and scope, or when requirements are unclear, ambiguous, or only exist as a vague idea. Use when a single requirement spans several independently testable capabilities and needs decomposing into a capability map of modules before specifying.

    62k81 tok idle · 2,705 in use
  5. planning-and-task-breakdownaddyosmani/agent-skills

    Breaks work into ordered tasks. Use when you have a spec or clear requirements and need to break work into implementable tasks. Use when a task feels too large to start, when you need to estimate scope, or when parallel work is possible.

    61k56 tok idle · 2,359 in use
  6. documentation-and-adrsaddyosmani/agent-skills

    Records decisions and documentation. Use when you need to document an architecture decision (ADR) or the reasoning behind a design choice, when changing public APIs, shipping features, or when you need to record context that future engineers and agents will need to understand the codebase.

    61k58 tok idle · 2,283 in use
  7. debugging-and-error-recoveryaddyosmani/agent-skills

    Guides systematic root-cause debugging. Use when tests fail, builds break, something that worked yesterday broke, behavior doesn't match expectations, or you encounter any unexpected error. Use when you need to figure out what broke and why — a systematic approach to finding and fixing the root cause rather than guessing.

    60k66 tok idle · 2,372 in use
  8. code-simplificationaddyosmani/agent-skills

    Simplifies code for clarity. Use when refactoring code for clarity without changing behavior. Use when code works but is harder to read, maintain, or extend than it should be. Use when reviewing code that has accumulated unnecessary complexity.

    60k51 tok idle · 2,942 in use