用途:该技能是 Vercel 维护的 React 与 Next.js 性能优化指南,适用于编写新组件或页面、实现数据获取(客户端或服务端)、审查性能问题、重构现有代码,以及优化打包体积和加载时间。规则按影响程度划分 8 个类别,共 57 条,每条以规则文件名形式给出,例如 async-parallel、bundle-barrel-imports。
主要能力与分类:1) 消除瀑布流(关键,前缀 async-),如 async-defer-await、async-parallel、async-dependencies、async-api-routes、async-suspense-boundaries。2) 打包体积优化(关键,bundle-),如 bundle-barrel-imports、bundle-dynamic-imports、bundle-defer-third-party、bundle-conditional、bundle-preload。3) 服务端性能(高,server-),如 server-cache-react、server-cache-lru、server-serialization、server-parallel-fetching、server-after-nonblocking。4) 客户端数据获取(中高,client-),如 client-swr-dedup、client-event-listeners、client-passive-event-listeners、client-localstorage-schema。5) 重渲染优化(中,rerender-),涵盖 memo、依赖项、派生状态、startTransition、refs 等。6) 渲染性能(中,rendering-),含 content-visibility、JSX 提升、hydration 处理等。7) JavaScript 性能(低中,js-),如批量 DOM 操作、Map/Set 查找、提前返回、缓存等。8) 高级模式(低,advanced-),如事件处理器存入 refs、init-once、useLatest。
使用方式:按规则文件(如 rules/async-parallel.md)查阅详细说明与代码示例;每个规则文件包含原因说明、错误示例与正确示例及补充上下文;完整汇总文档见 AGENTS.md。
限制:资料未提供安装命令、具体版本要求、许可信息或生效范围,也未说明如何导入到具体 AI 工具或框架中;以上内容暂未提供。