vercel-react-best-practices
À propos
Cette compétence fournit les directives d'optimisation des performances de Vercel pour React et Next.js, avec 57 règles prioritaires réparties en 8 catégories. Utilisez-la lors de l'écriture, de la revue ou de la refactorisation de code pour résoudre des problèmes de performance tels que les re-rendus, la taille des bundles et les modèles de récupération de données. Elle couvre les domaines clés d'optimisation, y compris les composants serveur/client, Suspense et les hooks React.
Installation rapide
Claude Code
Recommandénpx skills add TechNickAI/ai-coding-config -a claude-code/plugin add https://github.com/TechNickAI/ai-coding-configgit clone https://github.com/TechNickAI/ai-coding-config.git ~/.claude/skills/vercel-react-best-practicesCopiez et collez cette commande dans Claude Code pour installer cette compétence
Dépôt GitHub
Compétences associées
chatbot-widget-creator
AutreCette compétence crée un widget de chatbot de type ChatGPT, prêt pour la production, destiné à l'intégration frontend. Elle inclut des fonctionnalités essentielles telles que la protection contre les re-rendus infinis, la fonctionnalité "Demander à l'IA" par sélection de texte, et une intégration prête à l'emploi avec des backends RAG et le streaming SSE. Utilisez-la pour déployer rapidement une interface de chat éprouvée en conditions réelles et surveillée.
chatbot-widget-creator
AutreCette compétence génère un widget de chatbot de type ChatGPT prêt pour la production, avec des solutions intégrées pour les problèmes frontend courants. Elle offre une protection contre les re-rendus infinis, une fonctionnalité de sélection de texte "Demander à l'IA", et une prise en charge intégrée des backends SSE en streaming et RAG. Utilisez-la pour implémenter rapidement une interface de chat surveillée et performante dans votre application web.
react-patterns
AutreCette compétence offre des conseils d'expert sur les dernières pratiques de React 19, incluant les Composants Serveur, les Actions et les hooks comme `useOptimistic`. Utilisez-la pour l'architecture des composants, la gestion d'état et l'optimisation des performances lors du développement d'applications React modernes. Elle assiste activement dans la mise en œuvre des fonctionnalités concurrentes, de Suspense et du développement avec TypeScript.
react-patterns
AutreCette compétence fournit des conseils d'expert sur les dernières pratiques de React 19, y compris les Composants Serveur, les Actions et les fonctionnalités concurrentes comme `useOptimistic` et Suspense. Utilisez-la pour l'architecture des composants, la gestion d'état, l'optimisation des performances et la mise en œuvre du développement TypeScript moderne. C'est votre ressource incontournable pour toute question de développement React 19 ou revue de code.