My Wishlist for Hot Reloading — overreacted
13 hours ago
- 作者讨论了他们对热重载的长期兴趣，以及多次尝试在React中实现它的经历。
- React中的热重载目前可用但不完美，存在类方法替换不可靠等问题。
- 一个关键见解是，热重载函数比类更容易，而有了Hooks，函数组件功能完备，使得这种方法可行。
- 作者提出了一个草图，其中Babel插件将每个函数组件拆分为两部分，使用全局变量交换实现，同时通过保持Hook调用顺序来保留状态。
- 文章列出了评估热重载实现的原则：正确性（编辑前不可观察，遵循React规则）、局部性（最小化重新执行，保留父/兄弟状态）和反馈（视觉成功/失败指示，最小干扰）。
- 关键规则包括确保元素类型匹配，支持所有React类型如lazy/memo/forwardRef，并在正确性不可靠时优先选择状态丢失。
- 愿望清单还包括保留子组件状态、支持自定义Hook、渲染属性和高阶组件，当假设变化时回退到状态重置。
- 反馈机制应包括语法错误覆盖层、修复后自动消除，以及// !强制重挂载或// inspect调试等工具。
- 作者旨在优化快速迭代、优雅处理错误，并通过可预测性维护信任，同时承认JavaScript的局限性。