react-best-practices Skill
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance impr Published by openai in plugins.
What is react-best-practices Skill?
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance impr Published by openai in plugins. This profile combines repository metadata with install, compatibility, and usage signals so developers can quickly decide whether it fits their agent workflow before opening the source repository.
Automated repository signals based on public metadata such as recency, license, installation evidence, and adoption. These are not a security audit or endorsement.
Key capabilities
- Includes SKILL.md support
- Reusable instructions support
- Data analysis
- Writing
- Data analysis use cases
- Writing use cases
Technical details
- Install or run with Copy skill directory
When to use react-best-practices Skill
- Use it for data analysis.
- Use it for writing.
Built with
Editorial notes
Source
- Creator: openai
- Repository: openai/plugins
- Skill file: plugins/build-web-apps/skills/react-best-practices/SKILL.md
What it does
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance impr
Skill instructions
Vercel React Best Practices Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Contains 64 rules across 8 categories, prioritized by impact to guide automated refactoring and code generation. When to Apply Reference these guidelines when: - Writing new React components or Next.js pages - Implementing data fetching (client or server-side) - Reviewing code for performance issues - Refactoring existing React/Next.js code - Optimizing bundle size or load times Rule Categories by Priority | Priority | Category | Impact | Prefix | |----------|----------|--------|--------| | 1 | Eliminating Waterfalls | CRITICAL | async- | | 2 | Bundle Size Optimization | CRITICAL | bundle- | | 3 | Server-Side Performance | HIGH | server- | | 4 | Client-Side Data Fetching | MEDIUM-HIGH | client- | | 5 | Re-render Optimization | MEDIUM | rerender- | | 6 | Rendering Performance | MEDIUM | rendering- | | 7 | JavaScript Performance | LOW-MEDIUM | js- | | 8 | Adv
Explore related resources
Frequently asked questions
What is react-best-practices?
react-best-practices is a open-source AI agent skill with Copy skill directory. React and Next.js performance optimization guidelines from Vercel Engineering.
Who is react-best-practices best for?
react-best-practices is best for reusing agent instructions, scripts, and references, data analysis workflows, writing workflows.
How do I install react-best-practices?
Install or run react-best-practices using Copy skill directory. Check react-best-practices for the latest setup command.
Is react-best-practices actively maintained?
react-best-practices may need a closer maintenance check before production use.
Auto-fetched from GitHub.
