用途:审计 React 中 useEffect 的清理逻辑,找出缺失或错误的 cleanup,并给出修复代码与失败模式说明。
主要能力:按设置调用匹配所需清理,如 addEventListener 对应 removeEventListener(须同一函数引用)、setTimeout/clearTimeout、setInterval/clearInterval、fetch 或 axios 对应 AbortController.abort()、WebSocket 对应 ws.close()、IntersectionObserver/ResizeObserver/MutationObserver 对应 disconnect()、事件订阅对应 off()/unsubscribe()。仅计算、设置状态或调用稳定 setter 的 effect 无需清理。
非显而易见的失败模式:内联箭头函数监听器无法移除;AbortController 会取消网络请求但 fetch 会以 DOMException 拒绝,需专门捕获 AbortError;await 之后的状态更新还需 ignored 标志防止竞态;递归 setTimeout 需用 ref 保存当前 id;Observer 清理应调用 disconnect() 而非 unobserve;cleanup 在依赖变化时也会运行,不只在卸载时。
执行方式:找出范围内所有 useEffect,检查是否有 return;无 return 的按设置内容补对应清理;有 return 的核对清理是否与设置匹配;检查 await 后是否有未加 ignored 保护的状态更新;确认依赖变化时重新设置是否必要且开销低。
输出:修复后的 effect、每条修复的缺失项与导致的失败模式(内存泄漏、重复监听、过期更新、竞态),必要时补充 AbortError 捕获与 ignored 标志。限制:不适用于非 React 环境;axios 需 CancelToken 或 ≥0.22 的 signal;自定义轮询、已发出的 WebSocket 消息需各自取消机制。