skills.rest
lushly-dev
lushly-devOFFICIAL
Explore all skills by this author →
GitHub

optimize-performance

Guide web application performance optimization for bundle size and Core Web Vitals.

4|1|Updated Dec 30, 2025
Search Tags:#performance#web vitals#optimization#bundle size#lazy loading#code splitting
One-click install
npx skills add https://github.com/lushly-dev/afd --skill optimize-performance-lushly-dev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: optimize-performance
Source: https://github.com/lushly-dev/afd/tree/main/.claude/skills/optimize-performance
Command: npx skills add https://github.com/lushly-dev/afd --skill optimize-performance-lushly-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses slow web application performance by guiding users through the process of reducing bundle sizes, improving Core Web Vitals, and optimizing runtime efficiency.

Core Features & Use Cases

  • Core Web Vitals Improvement: Guides optimization for LCP, INP, and CLS metrics.
  • Bundle Size Reduction: Provides strategies for code splitting, tree shaking, and compression.
  • Runtime Optimization: Helps mitigate long tasks and identify bottlenecks.
  • Use Case: A developer notices their Lighthouse performance score has dropped significantly before a major release. They use this Skill to analyze the bundle, identify large dependencies, and implement code splitting to bring the score back up.

Quick Start

Use the optimize-performance skill to analyze the current bundle size and identify areas for improvement.

Frequently Asked Questions about optimize-performance

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

FAQPage Schema
How do I improve my web app's Core Web Vitals scores for LCP, INP, and CLS?▼

Improve Core Web Vitals by analyzing bundle sizes, implementing code splitting, lazy loading, and tree shaking to reduce load times, alongside mitigating long tasks to boost LCP, INP, and CLS scores.

What is the best way to reduce web application bundle size?▼

Reduce web application bundle size by applying code splitting to break up large files, utilizing tree shaking to remove unused code, and enabling compression to minimize the final transferred payload.

How does lazy loading help with web performance optimization?▼

Lazy loading helps web performance optimization by deferring non-critical resource loading until needed, directly reducing initial bundle size and freeing up the main thread to improve runtime efficiency.

How do I identify and fix long tasks causing runtime bottlenecks?▼

Identify and fix long tasks causing runtime bottlenecks by analyzing your bundle to find large dependencies, then applying code splitting to break them down and mitigate main thread blocking.

Can I use this approach to fix a dropped Lighthouse performance score?▼

Yes, you can fix a dropped Lighthouse performance score by analyzing your current bundle size, identifying large dependencies, and implementing code splitting and compression to bring the score back up.

Related Skills

Explore More Software Engineering Skills→
JochenYangJochenYang
21

performance-optimizer

Identify performance bottlenecks and optimize application speed across backend, database, and frontend workflows.

Community
Intermediate
rodrigotoledorodrigotoledo

perf-web-optimization

Optimize web performance by reducing bundle size, images, caching, and lazy loading.

Community
Intermediate
irizqiirizqi

react-vite-best-practices

Optimize React application builds with Vite configuration for bundle size reduction.

Community
Advanced
CallMeLuigiv2CallMeLuigiv2

python-performance-optimization

Profile Python CPU and memory usage with cProfile, memory_profiler, and line_profiler.

Community
Intermediate