SuperAPI AI 工具集

performance

通用与其它

查看项目

更新于 10-15 21:06

技能介绍

用途:在 Dune 应用中系统性地查找并修复性能问题,可针对指定范围或整个应用。核心原则是先测量、后优化,所有修复都需与基线数据对比。

主要能力与流程:

  1. 测量基线:运行 pnpm run build 与 pnpm run preview,用 Lighthouse 和 React Profiler 记录渲染耗时与次数。
  2. 修复重渲染:查找 JSX 内联对象/数组、每次渲染重建的事件处理器、未记忆化的 Context 值,改用 useMemo、useCallback,并对确认多余的纯展示组件使用 React.memo。
  3. 优化 DMS 查询:读密集场景优先使用走搜索路径的 instances.query 或 instances.search,而非 instances.list;按需重写查询。
  4. 服务端过滤:把 .filter() 等客户端过滤逻辑移入 API 请求的 filter 参数,并只选择所需字段。
  5. 分页与取数:为调用添加 limit,避免一次性拉取全部数据,用游标分页替代 offset,用 useInfiniteQuery 按需分页。
  6. 控制请求频率:搜索输入加 300ms 防抖,为 useQuery 设置 staleTime,避免重复并行请求。
  7. 大列表虚拟化:超过约 50 项时使用 @tanstack/react-virtual。
  8. 代码分割与包体积:对非首屏重页面用 React.lazy 与 Suspense,用 rollup-plugin-visualizer 分析并替换 lodash、moment 等大依赖。
  9. 内存泄漏:为 useEffect 中的订阅、定时器、事件监听和 fetch 添加清理逻辑。

使用方式:该技能以步骤化指令执行,包含 grep 检索模式与代码改写示例,需在具备 Dune 项目与相关依赖的工作区中使用。

限制:资料未提供具体收费、平台支持范围或效果数据;部分修复依赖项目实际结构与 API 能力,若 API 不支持对应过滤条件,需保留客户端过滤并注释说明原因。