performance-optimization

To fix Core Web Vitals and API latency bottlenecks, profile your systems before making changes to identify frontend and backend issues degrading user experience. This approach ensures targeted fixes with documented before-and-after verification.

The best way to reduce high LCP and slow API p95 latency is following a structured workflow: measure, identify, fix, verify, and guard. This method combines synthetic tooling like Lighthouse and DevTools with real-user metrics from web-vitals or APM.

To set up CI-driven bundle budgets for JavaScript and CSS payload, define performance guardrails capping JS, CSS, image, and font sizes alongside Core Web Vitals targets. These budgets enforce performance checks during your release process.

To diagnose frontend render-blocking resources and JS main-thread stalls, use diagnostic guidance for common bottlenecks covering render-blocking resources, bundle size, CLS, and main-thread stalls. This provides good-practice replacements for identified frontend issues.

To resolve backend N+1 queries and unbounded data fetching latency, apply diagnostic guidance for common backend bottlenecks including missing caches and routing latency. This provides good-practice replacements to fix confirmed backend issues.

You need real-user metrics to verify application performance optimization because this skill combines synthetic tooling like Lighthouse and DevTools with real-user metrics from web-vitals or APM. This ensures documented before-and-after verification of your targeted fixes.