performance-optimization

Diagnose and fix frontend and backend performance bottlenecks using a measure-first optimization workflow.

7|Updated Jan 11, 2026
One-click install
npx skills add https://github.com/peterblazejewicz/claude-plugins --skill performance-optimization-peterblazejewicz
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: performance-optimization
Source: https://github.com/peterblazejewicz/claude-plugins/tree/main/sync-state/dotnet-skills/vendor/agent-skills/skills/performance-optimization
Command: npx skills add https://github.com/peterblazejewicz/claude-plugins --skill performance-optimization-peterblazejewicz

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Slow applications and unverified optimization guesses waste engineering effort. This Skill enforces a measure-first workflow so you fix the actual bottleneck—whether it is Core Web Vitals regressions, N+1 database queries, or oversized JavaScript bundles—instead of optimizing blindly. ## Core Features & Use Cases - Structured Optimization Workflow: Follows a five-step loop (Measure, Identify, Fix, Verify, Guard) with synthetic tools like Lighthouse and RUM data from the web-vitals library. - Anti-Pattern Fixes: Provides concrete before/after code for N+1 queries, unbounded data fetching, missing image optimization, unnecessary React re-renders, large bundles, and missing caching. - Performance Budgets & Verification: Defines enforceable budgets (bundle size, API p95 latency, Lighthouse score) with CI checks and a post-change verification checklist. - Use Case: Your LCP score regressed to 4.5s after a release. Use this Skill to profile the network waterfall, identify an unoptimized hero image, apply responsive srcset markup, and confirm the improvement with before/after measurements. ## Quick Start Ask the AI to profile my app's slow page load and fix the identified performance bottleneck following the measure-first workflow.

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 for synthetic data and the web-vitals library for real user data. For LCP, optimize hero images with responsive srcset and fetchpriority; for INP, profile the main thread for long tasks over 50ms and reduce heavy JavaScript.

How to fix N+1 query problems in a backend API?

Replace per-record queries with a single query using joins or includes, such as passing an include option to your ORM call. Confirm the fix by checking the database query log before and after the change.

What performance budgets should I enforce in CI?

Recommended budgets include JavaScript under 200KB gzipped, CSS under 50KB, API p95 response time under 200ms, and a Lighthouse performance score of at least 90. Enforce them with bundlesize and Lighthouse CI in your pipeline.

When should I not optimize application performance?

Do not optimize without profiling evidence of an actual problem. Premature optimization adds complexity that costs more than the performance it gains, so measure first and fix only what the data proves matters.

Why is my React app re-rendering unnecessarily?

Inline objects and functions create new references on every render, triggering child re-renders. Hoist stable constants, wrap expensive components in React.memo, and use useMemo for costly computations, but avoid overusing memoization everywhere.