SuperAPI AI 工具集

vercel-react-best-practices

前端与建站

查看项目

更新于 10-15 20:12

技能介绍

用途:在编写、审查或重构 React 与 Next.js 应用时提供性能优化参考,帮助自动化重构与代码生成。触发场景为 React/Next.js 开发、组件编写、数据获取模式与打包优化;若项目不使用 React 或 Next.js 则不适用。

主要能力:收录 8 大类共 47 条规则,按影响程度分级并带前缀:1. 消除瀑布流(async-,CRITICAL),如 async-defer-await、async-parallel、async-api-routes;2. 包体积优化(bundle-,CRITICAL),如 bundle-barrel-imports、bundle-dynamic-imports;3. 服务端性能(server-,HIGH),如 server-cache-react、server-serialization;4. 客户端数据获取(client-,MEDIUM-HIGH),如 client-swr-dedup、client-event-listeners;5. 重渲染优化(rerender-,MEDIUM);6. 渲染性能(rendering-,MEDIUM);7. JavaScript 性能(js-,LOW-MEDIUM);8. 高级模式(advanced-,LOW)。每条规则包含原因说明、错误代码示例与正确代码示例及补充参考。

使用方式:在 React/Next.js 相关任务中加载该技能,按优先级查阅对应规则。完整展开的指南及详细代码示例见 AGENTS.md。

适用场景:编写新组件或页面、实现客户端/服务端数据获取、性能问题排查、既有代码重构、优化打包体积与加载时间。

限制:仅适用于使用 React 或 Next.js 的项目;未提供安装命令、收费或平台信息。