用途:该技能用于指导何时不应使用 useEffect,并给出更好的替代方案,适合在审查 React 代码、排查性能问题或考虑引入 useEffect 时使用。
核心原则:useEffect 只是与外部系统同步的逃生舱,而非状态管理或事件处理的通用工具。现代 React 模式优先采用单向数据流与事件驱动更新,避免基于 effect 的同步带来的性能损耗与复杂同步缺陷。
决策思路:若需与外部系统同步(浏览器 API、WebSocket、定时器),使用 useEffect;若是纯 React 应用逻辑,则按以下顺序判断:派生状态应在渲染时计算;用户操作触发应使用事件处理器;需要重置状态时应使用 key prop;确实需要 effect 时再考虑 useState/useReducer/setState 模式。
不应使用 useEffect 的场景:派生状态(导致双重渲染)、状态重置(数据陈旧)、用户操作(丢失意图)、列表过滤(额外渲染)、浏览器 API(并发下撕裂缺陷)、表单提交(脆弱的标志模式)、数据获取(手动缓存管理)等。
应使用 useEffect 的场景:订阅外部系统、设置带清理的定时器、管理第三方库集成、修改文档标题、渲染完成后进行埋点/分析。
React 19 提供新替代方案,可直接读取资源。相关资料还按主题组织为 anti-patterns、patterns-to-avoid、decision-tree 等文件,便于按需查阅,并引用 React 官方文档的《You Might Not Need an Effect》与《Synchronizing with Effects》。
限制:本资料未提供安装命令、价格或平台支持等具体信息,暂未提供。