如何管理同时进行的 DOM 修改答案

【问题标题】：how to manage simultaneous DOM modification如何管理同时进行的 DOM 修改
【发布时间】：2016-02-06 11:15:31
【问题描述】：

我是新来的反应和通量。我有一个 Web 应用程序，我需要部分使用 react 和 Flux 来开发它。但是，还有一个第三方引擎与应用程序连接并使用纯 javascript 操作网页的 DOM，而无需做出反应。

因此，由于基于 react 的组件创建处理虚拟 dom 概念，因此同时修改 DOM 存在问题。谁能建议我如何同时管理 React 和第三方引擎的 dom 修改。

【问题讨论】：

【解决方案1】：

您可以查看 React 组件生命周期方法 shouldComponentUpdate() 来决定谁应该负责渲染 DOM。

例如，如果你想让第三方引擎在初始渲染后完全接管你的Reactcomponent的渲染，你可以实现shouldComponentUpdate()显式返回false。

shouldComponentUpdate: function(nextProps, nextState) {
    return false;
}

【讨论】：

所以，如果我返回 false，那么当任何动作发生时，第三方引擎应该负责 DOM 操作，而不是 React 创建虚拟 dom、进行更改和重新渲染 dom，是吗？如果是这样，我们将失去使用 React（虚拟 dom 操作）的意义。如果我错了，请纠正我。
这通常是使用多个框架/工具来渲染 DOM 的问题，根据您使用的第三方引擎，职责划分可能非常复杂，协调两个渲染器可能会很麻烦在同一个组件上一起工作。此外，您不会失去使用 React 的意义，因为您只将单个 React 组件的渲染委托给第三方引擎，其余的 React 组件仍将利用虚拟 DOM 的优势。
因此，我建议您选择或者，而不是使用both。用 React 来研究绑定第三方引擎 DOM 操作是不值得的（听起来像是您需要自己创建一个庞大的新层）直到您进行基准测试并清楚地确定存在性能问题。跨度>