skills.rest
louai-420
louai-420COMMUNITY
Explore all skills by this author →
GitHub

web-performance-optimization

Diagnose loading, interactivity, and stability issues in web applications.

1|Updated Mar 5, 2026
Search Tags:#performance#lighthouse#cdn#seo#code-splitting#web-vitals#core-web-vitals
One-click install
npx skills add https://github.com/louai-420/PFE-Object-Detection --skill web-performance-optimization-louai-420
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-performance-optimization
Source: https://github.com/louai-420/PFE-Object-Detection/tree/main/skills/web-performance-optimization
Command: npx skills add https://github.com/louai-420/PFE-Object-Detection --skill web-performance-optimization-louai-420

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires lighthouse, web-vitals, sharp, webpack-bundle-analyzer, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

Slow-loading websites and poor Core Web Vitals hinder user engagement, SEO, and conversions.

Core Features & Use Cases

  • Performance Diagnostics: Measure load times, interactivity, and visual stability of web pages.
  • Optimization Strategies: Implement image optimization, code splitting, caching, and resource hints.
  • Use Case: Improve a slow e-commerce site’s LCP and INP scores to enhance mobile user engagement and increase sales.

Quick Start

Use the web-performance-optimization skill to analyze your homepage and get prioritized fixes.

Frequently Asked Questions about web-performance-optimization

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

FAQPage Schema
How do I diagnose poor Core Web Vitals scores for my website?▼

Diagnose poor Core Web Vitals by measuring loading, interactivity, and visual stability using Lighthouse and web-vitals libraries to identify bottlenecks. This process pinpoints specific rendering delays and input latency issues affecting your web pages.

What is the best way to improve LCP and INP on a slow e-commerce site?▼

Improve LCP and INP by applying optimization strategies like image pipeline enhancements, code splitting, and resource hints. These techniques reduce payload sizes and prioritize critical rendering, instantly boosting mobile user engagement.

Can I use webpack-bundle-analyzer to fix code splitting and loading bottlenecks?▼

Webpack-bundle-analyzer helps identify large module dependencies to target code splitting effectively. Reducing bundle size minimizes JavaScript execution time, directly improving interactivity and resolving network loading bottlenecks.

Do I need Lighthouse to measure website performance and apply caching strategies?▼

You need Lighthouse to audit performance metrics and validate caching strategies. It measures load times and network strategies, providing actionable diagnostics to optimize resource delivery for your web applications.

Why does image optimization with sharp require specific network strategies?▼

Image optimization with sharp requires specific network strategies to ensure properly sized assets are delivered efficiently. Combining optimized images with resource hints and CDN delivery minimizes layout shifts and improves visual stability.

When should I not use code splitting for web performance optimization?▼

Avoid code splitting when initial page load requires immediate execution of large monolithic scripts. Over-splitting can introduce excessive network requests and waterfall loading delays, negatively impacting interactivity scores.

Related Skills

Explore More Software Engineering Skills→
jholhewresjholhewres
3

bundler-analyze

Analyze JavaScript bundle sizes for Vite and Webpack projects.

Community
Basic
adityaarsharmaadityaarsharma
2

orbit-perf-cdn

Audit WordPress plugin assets for CDN compatibility, URL rewriting, cache headers, and CORS settings.

Community
Advanced
jorgegvalenciajorgegvalencia

core-web-vitals

Optimize LCP, INP, and CLS using web-vitals and Chrome DevTools.

Community
Intermediate
djkloopdjkloop

optimize

Diagnose and fix UI performance issues in web applications using Lighthouse and bundle analyzers.

Community
Intermediate