framework
framework/react/reliability/index.md
medium
framework-react-reliability-index
React 前端运行可靠性索引:异步竞态取消 / 副作用清理防泄漏 / 防重复提交 / chunk 加载恢复。Use when 写异步取数或表单提交 / 排查数据乱序或卸载报错 / 处理懒加载部署后白屏。
子项索引
| 子项 | 一句话 |
|---|---|
| race-condition-cancellation skill | 异步取数结果乱序覆盖的两种防护 — AbortController 真取消 / stale-result guard 忽略非最新响应 |
| effect-cleanup-leak skill | useEffect 副作用清理防泄漏 — 注册的监听/定时器/订阅/请求必须在 cleanup 里对称解除 |
| prevent-double-submit skill | 提交类操作前端防重复提交 — 用 isPending 锁住按钮 + 非幂等带 Idempotency-Key |
| chunk-load-recovery skill | 部署新版后旧页面懒加载报 ChunkLoadError 白屏的恢复:contenthash 文件名 + 捕获 preloadError 重载 + sessionStorage 去重防死循环 |
React · 运行可靠性索引
本层包含
| 名称 | 类型 | 一句话 |
|---|---|---|
| race-condition-cancellation | skill | AbortController / ignore 标志避免请求乱序覆盖 |
| effect-cleanup-leak | skill | useEffect 清理订阅 / timer / listener 防卸载泄漏 |
| prevent-double-submit | skill | 提交中态锁 + loading 禁用防重复提交 |
| chunk-load-recovery | skill | ChunkLoadError 捕获重载防部署后白屏 |
何时下钻
- 异步取数受快速切换 / 翻页影响导致结果乱序覆盖 →
race-condition-cancellation.md - useEffect 里订阅、定时器、监听器、未取消请求,卸载后报 setState 警告 →
effect-cleanup-leak.md - 表单 / 下单 / 支付按钮被连点造成重复请求 →
prevent-double-submit.md - 部署新版本后旧页面点路由懒加载报 ChunkLoadError 白屏 →
chunk-load-recovery.md