SuperAPI AI 工具集

react-best-practices

前端与建站

查看项目

更新于 10-16 03:48

技能介绍

用途:这是一个 React 与前端性能优化指南,包含按优先级排列的规则,用于指导自动重构和代码生成。在编写新 React 组件或 SSR 页面、实现客户端或服务端数据获取、评审性能问题、重构既有 React 代码、优化包体积或加载时间时参考。

主要能力:规则分 8 类,各有前缀与优先级。1 消除瀑布流(CRITICAL,async-):如 async-parallel 用 Promise.all() 处理独立操作、async-defer-await、async-cheap-condition-before-await、async-suspense-boundaries。2 包体积优化(CRITICAL,bundle-):如 bundle-barrel-imports 直接导入避免桶文件、bundle-dynamic-imports、bundle-defer-third-party。3 服务端性能(HIGH,server-):如 server-cache-react 用 React.cache()、server-parallel-fetching。4 客户端数据获取(MEDIUM-HIGH,client-):如 client-shared-cache-dedup、client-passive-event-listeners。5 重渲染优化(MEDIUM,rerender-):如 rerender-memo、rerender-derived-state、rerender-transitions。6 渲染性能(MEDIUM,rendering-):如 rendering-content-visibility、rendering-conditional-render。7 JavaScript 性能(LOW-MEDIUM,js-):如 js-index-maps、js-combine-iterations。8 高级模式(LOW,advanced-):如 advanced-event-handler-refs。

使用方式:阅读各规则文件获取详细说明与代码示例,如 rules/async-parallel.md、rules/bundle-barrel-imports.md。每个规则文件包含动机说明、错误代码示例、正确代码示例及补充参考。完整指南见 AGENTS.md。

限制:资料未说明版本要求、安装方式、收费与平台支持,暂未提供。