performance-optimization

Diagnose and fix application performance bottlenecks affecting Core Web Vitals.

1|1|Updated Apr 20, 2026

Search Tags:#caching #frontend #bundle size #performance optimization #profiling #core web vitals #backend apm

Ready to run

npx skills add https://github.com/svssdeva/agentic-skills --skill performance-optimization-svssdeva

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: performance-optimization
Source: https://github.com/svssdeva/agentic-skills/tree/main/frontend/performance-optimization
Command: npx skills add https://github.com/svssdeva/agentic-skills --skill performance-optimization-svssdeva

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps you reduce slow load times and poor responsiveness by turning performance work into a measured, repeatable workflow instead of guesswork.

Core Features & Use Cases

Core Web Vitals–focused optimization: Targets LCP, INP, and CLS with clear thresholds and diagnosis paths.
End-to-end performance workflow: Guides you through MEASURE → IDENTIFY → FIX → VERIFY → GUARD with both synthetic and real-user data.
Common bottleneck remediation: Provides actionable fixes for N+1 queries, unbounded fetching, render-blocking assets, oversized bundles, missing caching, and common frontend anti-patterns.
Budgets and regression prevention: Recommends enforceable performance budgets and CI checks to prevent backsliding.

Quick Start

Apply the performance-optimization workflow to diagnose why a page is slow, identify the bottleneck using both synthetic traces and RUM signals, implement the most relevant fix, and re-measure to confirm an improvement.

Frequently Asked Questions about performance-optimization

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

FAQPage Schema

How do I fix slow Core Web Vitals like LCP and INP on my frontend?▼

Diagnose sluggish interactions and slow first load by profiling LCP, INP, and CLS metrics with synthetic traces and real-user data, then apply targeted remediations for frontend anti-patterns and verify the improvements with before/after metrics.

What is the best way to reduce oversized bundle size and eliminate render-blocking assets?▼

Reduce bundle size and render-blocking assets by profiling to identify frontend anti-patterns, applying targeted remediations to minimize payloads, and enforcing performance budgets via CI checks to prevent regressions.

How do I diagnose slow API endpoints and backend bottlenecks?▼

Profile backend application performance monitoring data to identify N+1 queries and unbounded fetching, apply targeted remediations to resolve these backend bottlenecks, and re-measure to verify API endpoint responsiveness improves.

Can I set up performance budgets and CI checks to prevent regressions after code changes?▼

Yes, prevent regressions by establishing enforceable performance budgets and integrating CI checks that validate Core Web Vitals and perceived responsiveness, ensuring backsliding is detected and blocked immediately after code changes.

Why does my application feel slow even after optimizing initial load times?▼

Your application feels slow because perceived responsiveness relies on interaction latency, requiring you to profile interaction delays and backend API endpoints to identify hidden bottlenecks like N+1 queries or unoptimized rendering impacting real-user experience.