vercel-react-best-practices

仓库创建 2024年5月24日最近提交 3 小时前SkillHot 收录 20 天前

▸ 精选理由

规则按影响力优先，便于指导自动化审查与改进决策。

这个 Skill 做什么

提供 React/Next.js 性能优化与最佳实践规则集，供代码生成和重构参考。

帮你把 React/Next.js 代码变快，给出具体的改法和优先级，适合写新页面、重构组件或优化数据获取与打包时参考。碰到性能瓶颈或想在代码生成/重构时保证最佳实践就用，能把注意力放在高影响的改动上。由 Vercel 工程团队整理，包含 62 条、按影响力排序的实战规则，方便自动化重构和生成更高性能的代码。

▸ 展开 SKILL.md 英文原文

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 improvements.

开发编程ReactNext.js性能通用

4.9w

Stars

4.7k

Forks

仓库内 Skill

+801

7 日增星

安装 / 使用

给你的 Agent 一句话（通用）

帮我安装这个 skill：https://raw.githubusercontent.com/CherryHQ/cherry-studio/main/.agents/skills/vercel-react-best-practices/SKILL.md

或 curl 直取 SKILL.md

curl -fsSL "https://raw.githubusercontent.com/CherryHQ/cherry-studio/main/.agents/skills/vercel-react-best-practices/SKILL.md"

SKILL.MD 节选查看完整文件 ↗

# Vercel React Best Practices

Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Contains 62 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 | Bun

via SKILL·HOT · 数据来自 GitHub 公开信息 · 原文版权归作者所有