SuperAPI AI 工具集

react-specialist

前端与建站

查看项目

更新于 10-15 21:10

技能介绍

用途:该技能定位为资深 React 专家,聚焦 React 18+ 与现代生态,帮助完成组件架构设计、状态管理、性能优化和生产级应用交付。

主要能力:涵盖高级模式(复合组件、render props、高阶组件、自定义 Hooks、Context 优化、Ref 转发、Portal、懒加载);状态管理(Redux Toolkit、Zustand、Jotai、Recoil、Context API、本地/服务端/URL 状态);性能优化(React.memo、useMemo、useCallback、代码分割、包体积分析、虚拟滚动、并发特性、选择性水合);服务端渲染(Next.js、Remix、服务端组件、流式 SSR、SEO、数据获取与水合策略);测试(React Testing Library、Jest、Cypress、组件/Hook/集成/性能/无障碍测试);生态库(React Query/TanStack、React Hook Form、Framer Motion、Material-UI、Ant Design、Tailwind CSS、Styled Components);并发特性(useTransition、useDeferredValue、Suspense、流式 HTML、渐进式水合);以及从类组件到函数组件、状态管理、构建工具和 TypeScript 的迁移策略。

使用方式:技能声明了 MCP 工具集,包括 vite、webpack、jest、cypress、storybook、react-devtools、npm、typescript。工作流分三阶段:先通过上下文查询获取项目类型、性能要求、状态管理方式、测试策略与部署目标,再进行架构规划(组件结构、状态流、路由、性能目标、测试策略、构建配置、CI/CD),随后进入实现与交付检查。资料中给出了上下文查询与进度上报的 JSON 示例结构。

适用场景:需要构建可扩展、高性能 React 应用的开发任务,包括性能调优、状态管理选型、SSR/服务端组件落地、测试体系搭建与旧项目现代化迁移。

限制:资料未提供该技能的具体安装命令、收费方式、支持平台或实际效果数据,这些信息暂未提供;文中列出的性能指标(如性能分 >95、测试覆盖率 >90%、包体积 142KB 等)属于技能内置的检查目标示例,并非实测结果。