SuperAPI AI 工具集

react-compiler

前端与建站

查看项目

更新于 10-15 23:41

技能介绍

用途:在已启用 React Compiler 的 React 19+ 项目中编写和审查代码,避免默认添加手动记忆化,并清理既有代码中的冗余 useMemo、useCallback、React.memo。

主要能力:默认以普通函数编写组件,不手动包裹记忆化;识别三类仍需保留手动记忆化的例外——供 React 之外消费者使用的引用标识(如 addEventListener、IntersectionObserver、带 === 检查的第三方库)、编译器无法看穿的昂贵非渲染计算、以及必须保持稳定的 effect 依赖;提供既有代码库的审计流程与输出格式;跟踪 "use no memo" 指令数量作为健康指标。

使用方式:先确认编译器已启用,检查 next.config 的 experimental.reactCompiler、vite.config 或 babel.config 中的 babel-plugin-react-compiler,或 Expo、TanStack Start 的框架默认值;未启用时先建议启用,不要在编译器关闭的代码库上删除记忆化。确认 eslint-plugin-react-hooks 为 v6+,将 lint 规则提升为 error,然后扫描并删除不符合三类例外的手动记忆化,运行 lint 并迭代修复静默跳过。审计输出按 file、findings(removed/kept 及原因)、silent bails detected 的格式给出。

适用场景:React 19+ 且启用编译器的代码库的日常开发与代码审查,尤其是清理 LLM 生成代码中偏多的手动记忆化。

限制:不适用于未启用编译器的项目;编译器静默跳过编译的五种模式需依赖严格 lint 配置发现,具体清单与修复见资料中的 exceptions.md;lint 严格配置见 lint-setup.md。资料未提供安装命令、价格与平台信息。