Question

我有一个试剂单页应用程序。在根组件中，我有一个路由调度程序，它根据路由呈现组件。类似的东西：

(defn page []
  [(get component-lookup @current-page-name)])

我有一个列表页面和一个详细信息页面，用户经常来回切换。

问题是，在这两个页面之间切换会破坏并重新创建整个页面的组件。这显着减慢了页面转换速度，特别是在移动设备中。相比之下，从一个细节页面切换到另一个细节页面非常快，因为反应只需要重新渲染几个组件。

我首次尝试优化是让所有页面都一直呈现，但只要它们不可见就添加display:none。这加快了页面转换，但改变了生命周期方法的含义。例如，component-did-mount将执行，但该组件不可见，我无法更新其滚动位置。

有更好的方法吗？也许有可能卸载组件树，将其与子组件和状态/虚拟dom一起保存，以便稍后用新道具重新安装？

Answer 1

我认为如果不做出反应，你将无法做到这一点。生命周期本质上与虚拟dom的修改有关 - 这就是它们的整个存在点。

有点令人惊讶的是，DOM元素的渲染速度太慢，除非您的页面有数千个dom元素或大量媒体。在山上你在做什么？如果它是计算密集型的，我会在那里查看你是否可以分离出逻辑并对其进行缓存，以便它是一个轻量级的流程来切换组件。