Перейти к содержанию

Навык: лучшие практики React и Next.js от Vercel

Практическое руководство по ускорению веб-приложений на базе React и Next.js. Включает правила устранения водостоков данных, оптимизации бандлов, параллельной загрузки и минимизации сериализации.

Основной текст скилла

Назначение. Навык «Оптимизация производительности React и Next.js по стандартам Vercel Engineering» — Предоставление набора из 70 правил оптимизации производительности для приложений на React и Next.js, основанных на рекомендациях инженеров Vercel.. Карточка показывает границы применения и не означает, что внешний код был установлен или выполнен.

Краткий пересказ файла SKILL.md

Свод из 70 правил оптимизации производительности React и Next.js от Vercel Engineering. Охватывает устранение водостоков данных, оптимизацию бандлов, серверное кэширование, параллельную загрузку и клиентские паттерны рендеринга.

Структура файлов

  • SKILL.md
  • README.md

Требования и поддерживаемые инструменты

Требования: Базовое понимание архитектуры React и Next.js, Доступ к среде разработки Node.js.

Инструменты: Node.js, npm, npx.

Разрешения: не подтверждены.

Внешние подключения: https://github.com/vercel-labs/agent-skills.

Установка и вызов

  1. Открыть терминал в корневой папке проекта
  2. Выполнить команду установки навыка через npx

Пример вызова: npx навыки add https://github.com/vercel-labs/agent-skills —навык vercel-react-best-practices

Пример результата

Навык загружается в локальную среду агента для использования при анализе и генерации кода React/Next.js.

Потенциально опасные действия и проверка

  • не запускать внешний код
  • не передавать секреты и не менять файлы
  • Статус проверки безопасности: не подтверждено.
  • Внешний код не запускался; карточка собрана только по публичным данным.
  • Лицензия: не подтверждена.
  • Версия: не подтверждена.
  • Релиз или коммит: не подтверждён.
  • skills-sh-discovery-only: Страница навыки.sh не заменяет проверку репозитория, лицензии и закреплённого коммита.

Как проверить результат

Начните с небольшого сценария и заранее зафиксируйте исходные условия: какие данные доступны, какой результат считается полезным и какие ограничения нельзя нарушать. Такой короткий тест помогает отделить рабочую идею от неподтверждённого обещания и быстро найти место для доработки.

Сравните результат с исходной задачей по заранее выбранным критериям. Если качество не устраивает, изменяйте по одному параметру за раз, сохраняйте удачные варианты и отмечайте причины отказа. Для материалов с внешними сервисами отдельно проверьте права доступа, приватность входных данных и необходимость проверки человеком перед использованием.

Контрольный список

  • Проверить входные данные, формат результата и ограничения сценария.
  • Сверить фактический результат с измеримым критерием успеха.
  • Сохранить рабочую версию и зафиксировать, что требует редакционной проверки.

Что это

Предоставление набора из 70 правил оптимизации производительности для приложений на React и Next.js, основанных на рекомендациях инженеров Vercel.

Файл
SKILL.md (путь в репозитории не подтверждён)