skills.rest
Kwondongkyun
KwondongkyunCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

frontend-review-performance

Detect React/Next.js performance issues via static analysis.

Updated Aug 27, 2026
Search Tags:#performance#frontend#react#optimization#next.js#code-review
One-click install
npx skills add https://github.com/Kwondongkyun/claude-code-settings --skill frontend-review-performance
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-review-performance
Source: https://github.com/Kwondongkyun/claude-code-settings/tree/main/skills/frontend-review-performance
Command: npx skills add https://github.com/Kwondongkyun/claude-code-settings --skill frontend-review-performance

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review and audit React/Next.js code to identify performance issues such as unnecessary re-renders, N+1 requests, memory leaks, large bundle sizes, inefficient algorithms, and caching gaps, enabling targeted optimization.

Core Features & Use Cases

  • Detect unnecessary re-renders caused by inline functions/objects and missing memoization.
  • Identify N+1 API calls and suggest batching or caching strategies.
  • Spot memory leaks and uncleaned resources across lifecycle events.
  • Flag large bundle sizes and propose code-splitting or lazy loading.
  • Highlight inefficient algorithms and caching gaps that slow UX.
  • Use in code reviews, PR checks, and ongoing maintenance to improve performance.

Quick Start

Run a targeted review to surface the top 3 performance hotspots in your codebase.

Frequently Asked Questions about frontend-review-performance

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

FAQPage Schema
How do I find React performance issues like unnecessary re-renders in my codebase?▼

N+1 API calls in Next.js are identified through static analysis that checks server and client boundaries. The review suggests batching or caching strategies to reduce redundant requests and improve data fetching efficiency.

What causes memory leaks in React components and how can I detect them?▼

Large bundle sizes are flagged during a code review by analyzing your imports and component structure. The review proposes code-splitting or lazy loading strategies to reduce the bundle size and improve overall loading performance.

Can I use this to check for caching gaps and inefficient algorithms in Next.js?▼

Yes, you can use this review to check for caching gaps and inefficient algorithms in Next.js. It performs targeted checks across server and client boundaries to highlight specific areas where algorithmic improvements or caching would speed up UX.

How do I run a quick performance code review on my React project?▼

To run a quick performance code review on your React project, execute a targeted scan to surface the top performance hotspots. This scanner-based review analyzes components, hooks, and boundaries to provide actionable optimization insights.

Related Skills

Explore More Software Engineering Skills→
Mischio95Mischio95
1

shadcn-ui

Set up shadcn/ui components and forms with React Hook Form and Zod.

Community
Advanced
stratagastrataga

vercel-react-best-practices

Identify performance patterns and optimization opportunities in React/Next.js projects.

Community
Advanced
houkehouke

verify-code

Verify TypeScript code quality, type safety, memory management, and coding standards.

Community
Intermediate
GrupoUSGrupoUS
1

performance-profiling

Analyze web performance with Lighthouse audits for Core Web Vitals metrics.

Community
Intermediate