Vibe Index
🎯

performance

🎯Skill

from addyosmani/web-quality-skills

VibeIndex|
What it does
|

A comprehensive collection of agent skills for web quality optimization based on Google Lighthouse guidelines, Core Web Vitals, WCAG 2.1 accessibility, and modern SEO best practices.

Overview

A Claude Code skill from Addy Osmani's web-quality-skills collection that focuses on loading speed, runtime efficiency, and resource optimization based on Google Lighthouse guidelines and Core Web Vitals best practices. It is part of a stack-agnostic suite of six skills covering performance, accessibility, SEO, best practices, Core Web Vitals, and comprehensive web quality audits.

Key Features

  • Lighthouse-Based Optimization - Encodes patterns from 150+ Lighthouse audits across performance, accessibility, SEO, and best practices
  • Core Web Vitals Focus - Specific optimization patterns for LCP (Largest Contentful Paint), INP (Interaction to Next Paint), and CLS (Cumulative Layout Shift)
  • Stack-Agnostic - Works with React, Vue, Angular, Svelte, Next.js, Nuxt, Astro, plain HTML, and any other web framework
  • Part of Web Quality Suite - Included alongside accessibility, SEO, best practices, Core Web Vitals, and comprehensive audit skills
  • Easy Installation - Install via npx skills add addyosmani/web-quality-skills or npx add-skill addyosmani/web-quality-skills

Who is this for?

This skill is designed for web developers and frontend engineers who need AI-assisted guidance for optimizing website performance based on real-world performance engineering experience and Google Lighthouse standards. It is particularly valuable for teams working on Core Web Vitals improvements or preparing for performance audits across any web framework.

πŸ“¦

Same repository

addyosmani/web-quality-skills(6 items)

performance

Installation

Vibe Index InstallInstalls to .claude/skills/ - auto-recognized by Claude Code
npx vibeindex add addyosmani/web-quality-skills --skill performance
skills.sh Install⚠ Installs to .agents/skills/ - may not be auto-recognized by Claude Code
npx skills add addyosmani/web-quality-skills --skill performance
Manual InstallCopy SKILL.md content and save to the path below
~/.claude/skills/performance/SKILL.md

SKILL.md

4,188Installs
402
-
Last UpdatedJan 18, 2026
View on GitHubBack to Skills

More from this repository5

🎯
accessibility🎯Skill

Audits and improves web accessibility by evaluating content against WCAG 2.1 guidelines, ensuring usability for users with disabilities

🎯
seo🎯Skill

Audits and optimizes web SEO based on Google Lighthouse guidelines, covering meta tags, content structure, Core Web Vitals, and search ranking best practices

🎯
core-web-vitals🎯Skill

A comprehensive collection of agent skills for web quality optimization based on Google Lighthouse guidelines, Core Web Vitals, WCAG 2.1 accessibility, and modern SEO best practices.

🎯
best-practices🎯Skill

A comprehensive collection of agent skills for web quality optimization based on Google Lighthouse guidelines, Core Web Vitals, WCAG 2.1 accessibility, and modern SEO best practices.

🎯
web-quality-audit🎯Skill

A comprehensive collection of agent skills for web quality optimization based on Google Lighthouse guidelines, Core Web Vitals, WCAG 2.1 accessibility, and modern SEO best practices.