Agent Skill

Performance skill

performanceaddyosmani/web-quality-skillsskills/performance/SKILL.md

Optimize web performance for faster loading and better user experience. Use when asked to "speed up my site", "optimize performance", "reduce load time", "fix slow loading", "improve page speed", or "performance audit".

3.0kMIT

always on

49 tokname + description

once used

3,214 tokSKILL.md body

bundled files

210 KB

repo stars

3.0kGitHub

Install the Performance skill

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

npx skills add https://github.com/addyosmani/web-quality-skills --skill performance

Claude Code, by hand (all projects)

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

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.

When	What loads	Cost
Every session	Name and description	49 tok
When the agent uses it	The SKILL.md instructions	3,214 tok
Only if opened	2 bundled files (10 KB)	varies

Until it is used, performance costs about 28× less than the median MCP server we measured (1,362 tokens on every turn). Installing all 6 skills from addyosmani/web-quality-skills would load 320 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
How it works
Starting performance budget
Critical rendering path
Server response
Resource loading
JavaScript optimization
Image optimization
Format selection
Responsive images
LCP image priority
Font optimization
Loading strategy
Preloading critical fonts
Variable fonts
Caching strategy
Cache-Control headers
Service worker caching
Runtime performance
Avoid layout thrashing
Debounce expensive operations
Use requestAnimationFrame
Virtualize long lists
Smooth navigations with View Transitions

More skills from addyosmani/web-quality-skills

All skills in this repo

accessibilityaddyosmani/web-quality-skills
Audit and improve web accessibility following WCAG 2.2 guidelines. Use when asked to "improve accessibility", "a11y audit", "WCAG compliance", "screen reader support", "keyboard navigation", or "make accessible".
63k51 tok idle · 3,541 in use
best-practicesaddyosmani/web-quality-skills
Apply modern web development best practices for security, compatibility, and code quality. Use when asked to "apply best practices", "security audit", "modernize code", "code quality review", or "check for vulnerabilities".
3.0k49 tok idle · 2,913 in use
core-web-vitalsaddyosmani/web-quality-skills
Optimize Core Web Vitals (LCP, INP, CLS) for better page experience using field and lab evidence. Use when asked to "improve Core Web Vitals", "fix LCP", "reduce CLS", "optimize INP", "page experience optimization", or "fix layout shifts".
3.0k67 tok idle · 2,181 in use
seoaddyosmani/web-quality-skills
Optimize for search engine visibility and ranking. Use when asked to "improve SEO", "optimize for search", "fix meta tags", "add structured data", "sitemap optimization", or "search engine optimization".
3.0k46 tok idle · 3,160 in use
web-quality-auditaddyosmani/web-quality-skills
Run an evidence-led web quality audit covering performance, accessibility, SEO, best practices, and agentic browsing. Use when asked to "audit my site", "review web quality", "run lighthouse audit", "check page quality", or "optimize my website".
3.0k158 tok idle · 2,242 in use