虚拟 DOM 的优缺点及实现原理？

1. 优点1). 保证性能下限： 框架的虚拟 DOM 需要适配任何上层 API 可能产生的操作，它的一些 DOM 操作的实现必须是普适的，所以它的性能并不是最优的；但是比起粗暴的 DOM 操作性能要好很多，因此框架的虚拟 DOM 至少可以保证在你不需要手动优化的情况下，依然可以提供还不错的性能，即保证性能的下限；2). 无需手动操作 DOM： 我们不再需要手动去操作 DOM，只需要写好 View-Model 的代码逻辑，框架会根据虚拟 DOM 和 数据双向绑定，帮我们以可预期的方式更新视图，极大提高我们的开发效率；3). 跨平台： 虚拟 DOM 本质上是 JavaScript 对象,而 DOM 与平台强相关，相比之下虚拟 DOM 可以进行更方便地跨平台操作，例如服务器渲染、weex 开发等等。2. 缺点1). 首次显示要慢些: 首次渲染大量DOM时，由于多了一层虚拟DOM的计算, 会比innerHTML插入慢2). 无法进行极致优化： 虽然虚拟 DOM + 合理的优化，足以应对绝大部分应用的性能需求，但在一些性能要求极高的应用中 无法进行针对性的极致优化。2.虚拟 DOM 的简单实现原理主要包括以下 3 部分：1. 用 JavaScript 对象模拟真实 DOM 树，对真实 DOM 进行抽象；2. diff 算法 — 比较两棵虚拟 DOM 树的差异；3. pach 算法 — 将两个虚拟 DOM 对象的差异应用到真正的 DOM 树。

DreamCoders / CoderGuide

Content Risk Flag

Comments (0)

DreamCoders / CoderGuide .gitee-modal { width: 500px !important; }

Content Risk Flag