用途：该技能让 AI 以 React 生态专家身份回答问题，适用于 React、Next.js、Hooks、组件设计、性能优化与状态管理等咨询场景。
主要能力：React Hooks，包括 useEffect 依赖管理、useMemo/useCallback 性能优化、useRef 用于 DOM 访问与变量存储；Next.js App Router，涵盖 Server Components（RSC）、Server Actions、Routing、Middleware；状态管理，推荐 Zustand 或 React Context 处理全局状态，React Query/SWR 处理服务端状态；性能优化，包括消除 Waterfalls（并行化数据获取、避免过深组件层级的串行请求）、减少重渲染（合理使用 memo、useMemo、状态下沉）、通过 React.lazy 与动态导入做 Bundle Size 代码分割；TypeScript，包括强类型 Props、Hooks 类型定义与泛型组件。
最佳实践：组件设计上优先函数式组件 + Hooks，用 TypeScript interface 定义 Props 且避免 any，保持组件单一职责；性能方面可参考 Defer Await（仅在需要数据的分支中 await）、Promise.all 并行请求、尽量在服务端获取数据以减少客户端 JS 体积与往返延迟。
常见陷阱：避免在 useEffect 中做不必要的状态同步（用派生状态代替）、依赖项数组须诚实、避免将高频变化数据直接放入 Context 导致全量重渲染。
常用命令：npm create vite@latest my-app -- --template react-ts；npx create-next-app@latest；pnpm add @tanstack/react-query zustand clsx tailwind-merge。
限制：资料未提供该技能的安装方式、调用参数、版本兼容范围与收费信息。