SkillsAdd

smithery/heyvhuang

review-react-best-practices

Review or refactor React / Next.js code for performance and reliability using a prioritized rule library (waterfalls, bundle size, server/client data fetching, re-renders, rendering).

Installation

$ npx skills add smithery/heyvhuang --skill review-react-best-practices
View on skills.sh ↗ Website ↗

Summary

  • Review or refactor React / Next.js code for performance and reliability using a prioritized rule library (waterfalls, bundle size, server/client data fetching, re-renders, rendering).
  • Use when writing React components, Next.js pages (App Router), optimizing bundle size, improving performance, or doing a React/Next.js performance review.

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

vercel-react-best-practices Shared topics
vercel-labs/agent-skills 697.8K installs
supabase Shared topics
supabase/agent-skills

Use when doing ANY task involving Supabase. Triggers: Supabase products (Database, Auth, Edge F…

263K installs
vercel-react-view-transitions Shared topics
vercel-labs/agent-skills 115.9K installs
ai-sdk Shared topics
vercel/ai 53.4K installs
clerk-setup Shared topics
clerk/skills 42.6K installs
clerk Shared topics
clerk/skills 25.8K installs

Also in this package

Other skills from smithery/heyvhuang · top by installs.

npx skills add smithery/heyvhuang
workflow-template-seeder 0 workflow-ship-faster 0 workflow-feature-shipper 0 workflow-creator 0 workflow-brainstorm 0 tool-x-article-publisher 0 tool-ui-ux-pro-max 0 tool-schema-markup 0 tool-hooks-doctor 0 tool-design-style-selector 0

Browse all from smithery/heyvhuang

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 2,592 B
  • docs SUMMARY.md 373 B

History

  1. First recorded snapshot · 0 installs

SKILL.md

React Best Practices Review (Performance-First)

Use this skill to turn “React feels slow / Next.js page is heavy / too many requests” into a repeatable, prioritized review.

This skill is intentionally built like a rule library:

  • SKILL.md: how to review + how to search rules
  • references/rules/*: one rule per file (taggable, sortable, easy to evolve)

When to apply

Use when:

  • Building or refactoring React components
  • Working in Next.js (App Router) on RSC boundaries, Server Actions, data fetching
  • Reviewing PRs for performance regressions
  • Bundle size increases / slow HMR / cold start issues
  • UI jank / unnecessary re-renders / hydration issues

Review method (prioritized)

  1. Start with CRITICAL rules first (waterfalls + bundle).
  2. Only then go to HIGH (server patterns + serialization).
  3. Then MEDIUM (re-render + rendering).
  4. Then LOW-MEDIUM micro-optimizations (JS hot paths).

Section ordering lives in: [references/rules/sections.md](references/rules/sections.md)

How to use the rules efficiently

Search by keyword

rg -n "waterfall|Promise\\.all|defer await" references/rules
rg -n "barrel|optimizePackageImports|dynamic" references/rules
rg -n "cache\\(|React\\.cache|serialization|RSC" references/rules
rg -n "memo\\(|useMemo|useCallback|dependencies" references/rules

Search by tag

Each rule has tags: in YAML frontmatter.

rg -n "tags:.*bundle" references/rules
rg -n "tags:.*rerender" references/rules

Output format (recommended)

When reviewing code, output:

  1. Summary (1 paragraph)
  2. Critical fixes (must-fix, biggest wins)
  3. High impact (should-fix)
  4. Medium / Low (nice-to-have)

For each issue include:

  • Rule name (and file under references/rules/)
  • Location (path:line)
  • Why it matters (latency / bundle / CPU / UX)
  • Minimal fix direction (prefer small diffs)

If running in a Ship Faster run directory, persist the report to:

  • run_dir/evidence/react-best-practices-review.md

Rule library

Rules live in:

  • [references/rules/](references/rules/)
  • Rule template: [references/rules/template.md](references/rules/template.md)