performance

Analyze web pages and generate optimization recommendations for Core Web Vitals.

1|Updated Mar 15, 2026
One-click install
npx skills add https://github.com/kennyolofsson23-netizen/claude-code-config --skill performance-kennyolofsson23-netizen
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: performance
Source: https://github.com/kennyolofsson23-netizen/claude-code-config/tree/main/skills/performance
Command: npx skills add https://github.com/kennyolofsson23-netizen/claude-code-config --skill performance-kennyolofsson23-netizen

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Performance issues cause slow page loads, high bounce rates, and poor Core Web Vitals scores, hurting conversions and SEO.

Core Features & Use Cases

  • Performance budgets: Defines limits for page weight, JavaScript, CSS, images, fonts, and third‑party resources.
  • Critical rendering path optimizations: Recommendations for server response, resource preloading, and script loading strategies.
  • Asset optimization: Guidance on image formats, responsive images, and font loading.
  • Caching and runtime tricks: Cache‑Control headers, service‑worker strategies, layout‑thrashing avoidance, and debouncing.
  • Measurement & reporting: Key Web Vitals metrics, Lighthouse commands, and monitoring instructions.

Quick Start

Ask the performance skill to audit and optimize the loading speed of my website.

Frequently Asked Questions about performance

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I optimize website loading speed and improve Core Web Vitals scores?

Website loading speed is optimized by applying techniques to HTML, CSS, JavaScript, images, fonts, and server configurations. This generates actionable code snippets and settings to meet Core Web Vitals targets and reduce resource budgets.

What is the best way to define performance budgets for web page weight and third-party resources?

Performance budgets define strict limits for page weight, JavaScript, CSS, images, fonts, and third-party resources. Establishing these boundaries prevents resource bloat and maintains optimal loading speeds across web pages.

How do I optimize the critical rendering path for better web performance?

Optimize the critical rendering path by implementing recommendations for server response times, resource preloading, and script loading strategies. These adjustments prioritize visible content and accelerate page rendering.

How do I use caching and service-worker strategies to improve site speed?

Improve site speed by applying caching techniques like Cache-Control headers, service-worker strategies, and runtime tricks to avoid layout thrashing. These reduce redundant network requests and streamline JavaScript execution.

How do I measure and monitor web performance using Lighthouse and Core Web Vitals?

Measure web performance by utilizing key Web Vitals metrics and executing Lighthouse commands. This provides reporting instructions to continuously track loading speed, user experience, and optimization success.