调用渲染vs绘制DOM？

Question

我正在学习React，并试图更好地了解生命周期和不同阶段。

我刚刚读到的一件事是“React首先呈现然后安装元素。在此上下文中进行渲染意味着调用类的render（），而不是绘制DOM“

我想我真的不明白这意味着什么。有人可以用简单的方式或用例子来解释它吗？

提前致谢！

Answer 1

首先提供一些简化的定义：

1. 浏览器使用dom决定显示什么。作为响应，这称为绘画，因为每当将某物添加到dom时，浏览器都必须重新绘画屏幕。
2. dom的操作成本很高。时间或资源
3. 反应看起来如此之快的原因之一是它使用了人们称为virtual dom的东西。虚拟dom尝试镜像实际的dom，它们可能会保持一段时间不同步，因为虚拟dom的所有更改都不会立即反映在实际dom上（否则，拥有虚拟dom会有什么好处？）

牢记这些定义，让我们看一下React的作用：

1. 何时react将触发render方法来填充其虚拟dom
2. 它将保留对虚拟dom的更改，并将其保留在屏幕中，一旦确定了更改屏幕的好时机，它将仅刷新更改。 / em>。这称为painting。

React在后台进行了很多优化，我不知道所有这些优化（还会争论，我不需要知道它们在做什么），但是这里要记住一些事情：

1. 只要您的render方法返回相同的内容，react就不会在屏幕上执行任何操作。
2. 因此，即使您不期望，期望React可以多次调用render方法。
3. 因此，建议保持render方法不受任何副作用或任何资源密集型操作的影响，例如获取数据或转换数据结构。可以将其视为：render方法应仅具有与需要呈现的内容有关的逻辑，它可能需要执行的任何其他操作，都可以在外部计算并放入状态或变量，甚至可以记忆。