vercel-react-best-practices
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.
Install
npx skills add CherryHQ/cherry-studio@vercel-react-best-practicesRuns in your terminal. Adds the skill globally for Claude Code, Cursor, Codex and others; add -g -y to skip prompts.
What it does
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…
Excerpt from the skill's own SKILL.md. Read the full file on GitHub before installing: skills run with your agent's permissions.
View source on GitHubBefore you install
Skills are plain text instructions the agent follows, sometimes with scripts. Check the source, prefer repositories with many installs and stars, and read any script it ships.
Categories
Related skills
- create-skill
CherryHQ/cherry-studio
Create a new skill in the current repository. Use when the user wants to create/add a new skill, or mentions creating a skill from scratch. This skill follows the workflow defined in .agents/skills/README.md and helps scaffold, validate, and sync new skills.
89 installs 51KTestingDocumentationAI & agents - gh-create-issue
CherryHQ/cherry-studio
Use when user wants to create a GitHub issue for the current repository. Must read and follow the repository's issue template format.
52 installs 51KProductivityGit & GitHub - gh-create-pr
CherryHQ/cherry-studio
Create or update GitHub pull requests using the repository-required workflow and template compliance. Use when asked to create/open/update a PR so the assistant reads `.github/pull_request_template.md`, fills every template section, preserves markdown structure exactly, and marks missing data as N/A or None instead of skipping sections.
48 installs 51KTestingDataProductivity - gh-pr-review
CherryHQ/cherry-studio
Automated Cherry Studio review for local branches, PRs, commits, files, architecture docs, and repository skills. Use for code or documentation reviews that need project-specific naming, main/renderer/shared placement and dependency rules, IpcApi and DataApi boundaries, lifecycle/service ownership, renderer hooks, React/UI conventions, and tests. Review depth adapts to diff size and runtime subagent capability (single-agent or multi-agent reviewer-verifier). Report-only by default; code fixes and GitHub submission each require explicit invocation-time authorization (`fix` / `submit`). Normal-review prompts and safe interruption behavior follow the interaction contract below. To diagnose gaps in the skill after a review session, run `/gh-pr-review diag`.
47 installs 51KDesign & UIReact & Next.jsDocumentation - prepare-release
CherryHQ/cherry-studio
Prepare a new release by collecting commits, generating bilingual release notes, updating version files, and creating a release branch. Use when asked to prepare/create a release, bump version, or run `/prepare-release`.
46 installs 51KDeploy & DevOpsSEOProductivity - cherry-pr-test
CherryHQ/cherry-studio
Test Cherry Studio PRs by resolving and checking out a PR, statically inspecting its changes, running interactive UI tests against a safely tracked Electron instance through CDP, producing a structured report, cleaning up only the owned test instance, and restoring the original branch.
27 installs 51KDesign & UITestingAI & agents