vercel-react-best-practices
Über
Diese Fähigkeit bietet Vercels Leistungsoptimierungsrichtlinien für React und Next.js mit 57 priorisierten Regeln in 8 Kategorien. Nutzen Sie sie beim Schreiben, Überprüfen oder Refaktorisieren von Code, um Leistungsprobleme wie Neu-Renderings, Bundle-Größe und Datenabrufmuster zu adressieren. Sie deckt wichtige Optimierungsbereiche ab, einschließlich Server-/Client-Komponenten, Suspense und React Hooks.
Schnellinstallation
Claude Code
Empfohlennpx 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-practicesKopieren Sie diesen Befehl und fügen Sie ihn in Claude Code ein, um diese Fähigkeit zu installieren
GitHub Repository
Verwandte Skills
chatbot-widget-creator
AndereDiese Fähigkeit erstellt ein produktionsreifes ChatGPT-artiges Chatbot-Widget für die Frontend-Integration. Sie umfasst kritische Funktionen wie unendlichen Re-Render-Schutz, "Ask AI"-Funktionalität bei Textauswahl und sofortige Integration mit RAG-Backends und SSE-Streaming. Nutzen Sie sie, um schnell eine erprobte, überwachte Chat-Oberfläche bereitzustellen.
chatbot-widget-creator
AndereDiese Fähigkeit erzeugt ein produktionsreifes Chatbot-Widget im ChatGPT-Stil mit integrierten Lösungen für häufige Frontend-Probleme. Sie bietet Schutz vor unendlichen Neuaufrufen, "Ask AI"-Funktionalität für Textauswahl und integrierte Unterstützung für Streaming-SSE- und RAG-Backends. Nutzen Sie sie, um schnell eine überwachte, leistungsfähige Chat-Oberfläche in Ihrer Webanwendung zu implementieren.
typescript-docs
AndereDiese Fähigkeit erstellt umfassende TypeScript-Dokumentation unter Verwendung von JSDoc und TypeDoc für API-Referenzen, Architekturentscheidungsprotokolle (ADRs) und frameworkspezifische Beispiele. Nutzen Sie sie, um automatisch Module zu dokumentieren, mehrschichtige Dokumentation für verschiedene Zielgruppen zu erstellen oder Dokumentation für Projekte mit NestJS, Express, React, Angular oder Vue einzurichten.
react-patterns
AndereDiese Fähigkeit bietet fachkundige Anleitung zu den neuesten Patterns von React 19, einschließlich Server Components, Actions und Hooks wie `useOptimistic`. Nutzen Sie sie für Komponentenarchitektur, State-Management und Performance-Optimierung beim Entwickeln moderner React-Anwendungen. Sie unterstützt proaktiv bei der Implementierung von Concurrent Features, Suspense und der TypeScript-Entwicklung.