skills.rest
TwuanMinn
TwuanMinnCOMMUNITY
Explore all skills by this author →
GitHub

web-performance-optimization

Diagnose and fix website performance bottlenecks using Lighthouse and Core Web Vitals.

Updated Jan 26, 2026
Search Tags:#caching#lighthouse#web-performance#bundle-size#image-optimization#core-web-vitals
One-click install
npx skills add https://github.com/TwuanMinn/fadelab --skill web-performance-optimization-twuanminn
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-performance-optimization
Source: https://github.com/TwuanMinn/fadelab/tree/main/.agent/skills/skills/web-performance-optimization
Command: npx skills add https://github.com/TwuanMinn/fadelab --skill web-performance-optimization-twuanminn

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps developers systematically improve website and web application performance, reducing loading times and uncomfortable user experiences by focusing on Core Web Vitals, bundle size, caching, and runtime performance.

Core Features & Use Cases

  • Measure and analyze performance using Lighthouse, Core Web Vitals, and bundle size checks.
  • Prioritize and implement optimizations such as code splitting, lazy loading, image optimization, and caching strategies.
  • Use case: a site with slow LCP and CLS can be accelerated and ranked higher in SEO after a structured optimization plan.

Quick Start

Run a baseline Lighthouse audit to identify bottlenecks, then apply the prioritized optimizations to improve LCP, FID, and CLS.

Frequently Asked Questions about web-performance-optimization

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

FAQPage Schema
How do I improve Core Web Vitals for slow loading pages?▼

Reduce JavaScript bundle size by implementing code splitting and lazy loading to minimize downloaded code. Analyze the bundle with size checks to prioritize optimizations and validate improvements using performance budgets.

What's the best way to optimize images for web performance?▼

Optimize images for web performance by applying lazy loading and compression strategies to reduce file sizes. This directly improves load times and contributes to better LCP scores in Core Web Vitals.

Can I use Lighthouse to diagnose slow page loads and large bundles?▼

Yes, you can use Lighthouse to measure performance and diagnose issues causing slow page loads. It helps identify large JavaScript bundles and unoptimized images, allowing you to prioritize fixes for Core Web Vitals.

Why does my site have a poor LCP and CLS score in search rankings?▼

Your site has a poor LCP and CLS score due to performance bottlenecks like unoptimized images and large bundles. Diagnosing these issues with RUM and Lighthouse allows you to apply caching and optimize loading for higher SEO rankings.

Related Skills

Explore More Software Engineering Skills→
josuenavarroaguadojosuenavarroaguado

performance-optimization

Diagnose and fix web performance bottlenecks using Lighthouse, RUM, and profiling data.

Community
Advanced
rbaumierrbaumier
4

web-performance

Identify and fix frontend performance bottlenecks using Lighthouse and Chrome DevTools.

Community
Advanced
kuse-aikuse-ai
6

ui-component-builder

Build reusable UI components for React, Vue, and vanilla JavaScript.

Official
Basic
Shresth-shShresth-sh

react-patterns

Identify and apply React/Next.js performance optimization patterns for load times.

Community
Advanced