AIKraft/AI/Войти
AIKraft/Skills/vercel-react-best-practices

vercel-react-best-practices

Оптимизация производительности React и Next.js по 70 правилам от Vercel. Помогает при написании, ревью и рефакторинге кода, сборке бандлов и улучшении скорости загрузки.

VEVercel official Разработка ★ 31.9k

Что делает навык

Skill предоставляет 70 правил оптимизации производительности для React и Next.js, сгруппированных по приоритету влияния. Он помогает писать, ревьюить и рефакторить код, а также оптимизировать размер бандлов и время загрузки.

Когда применять

  • Написание новых React-компонентов или страниц Next.js
  • Реализация загрузки данных (data fetching) на клиенте или сервере
  • Ревью кода на наличие проблем с производительностью
  • Рефакторинг существующего кода React/Next.js
  • Оптимизация размера бандла или времени загрузки

Как работает

  1. Определить категорию проблемы по приоритету (от CRITICAL до LOW) и соответствующему префиксу правила
  2. Прочитать файл конкретного правила из директории rules/ для получения объяснения и примеров кода
  3. Сравнить текущий код с примерами «Incorrect» и «Correct» из документации правила
  4. Применить исправление, следуя рекомендациям по оптимизации (например, использование Promise.all, next/dynamic, React.cache)
  5. При необходимости обратиться к полному руководству в файле AGENTS.md

Примеры запросов агенту

Оптимизируй этот компонент, устранив waterfall-эффекты при загрузке данных
Проверь этот код на соответствие правилам оптимизации размера бандла (bundle size)
Рефактори серверные действия (server actions) согласно правилам server-side performance

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «vercel-labs-vercel-react-best-practices» из репозитория: # https://github.com/vercel-labs/agent-skills
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r vercel-labs-vercel-react-best-practices/ ~/.claude/skills/vercel-labs-vercel-react-best-practices/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.