performance-optimization

Diagnose and fix frontend and backend performance bottlenecks using measurement-driven profiling workflows.

Updated Apr 21, 2026
One-click install
npx skills add https://github.com/alissonpef/copilot_agent_skills --skill performance-optimization-alissonpef
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: performance-optimization
Source: https://github.com/alissonpef/copilot_agent_skills/tree/main/.github/skills/performance-optimization
Command: npx skills add https://github.com/alissonpef/copilot_agent_skills --skill performance-optimization-alissonpef

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Slow applications hurt user experience and business metrics, but optimizing without data wastes effort on the wrong things. This Skill enforces a measure-first workflow so you fix the actual bottleneck instead of guessing. ## Core Features & Use Cases - Measure-Identify-Fix-Verify-Guard Workflow: A five-step process that establishes baselines with synthetic tools (Lighthouse, DevTools) and real-user monitoring (web-vitals, CrUX) before and after every change. - Bottleneck Diagnosis Guides: Symptom-to-cause decision trees for slow page loads, sluggish interactions, and slow APIs, covering Core Web Vitals targets (LCP, INP, CLS). - Anti-Pattern Fixes with Code Examples: Concrete before/after code for N+1 queries, unbounded fetching, unoptimized images, unnecessary React re-renders, large bundles, and missing caching. - Use Case: Your dashboard page loads in 6 seconds. Use this Skill to profile the network waterfall, discover N+1 database queries and an oversized bundle, apply the fixes, and verify LCP drops under 2.5s. ## Quick Start Use the performance-optimization skill to profile my app's slow dashboard page and identify the real bottleneck before fixing it.

Frequently Asked Questions about performance-optimization

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

FAQPage Schema
How do I improve Core Web Vitals scores like LCP and INP?▼

Measure first with Lighthouse or the web-vitals library, then target the specific bottleneck. For LCP, optimize hero images with responsive srcset and fetchpriority; for INP, reduce long tasks on the main thread and unnecessary re-renders.

How to fix N+1 database queries in a backend API?▼

Replace per-record queries with a single query using joins or ORM includes, such as Prisma's include option. Detect N+1 patterns by enabling database query logging and watching for repeated similar queries per request.

Should I use synthetic testing or real user monitoring for performance?▼

Use both. Synthetic tools like Lighthouse give reproducible results for CI regression detection, while RUM via the web-vitals library or CrUX confirms that fixes actually improved real user experience.

When should I not optimize application performance?▼

Avoid optimizing without profiling evidence of a problem. Premature optimization adds complexity that costs more than the performance it gains; only fix what measurements prove matters.

How do I enforce a performance budget in CI?▼

Set budgets such as JavaScript under 200KB gzipped and API p95 under 200ms, then enforce them with bundlesize checks and Lighthouse CI (lhci autorun) in your pipeline.