千锋教育web前端高频面试题视频教程，kerwin大话前端面试秘籍（附答案）

P16-vue高频面试题-虚拟dom为什么会提高性能

虚拟 DOM（Virtual DOM）是一种内存中的表示方式，它是对真实 DOM 的轻量级抽象。在 Vue 和 React 等现代 JavaScript 框架中，通过使用虚拟 DOM 进行操作和更新，可以提高性能的主要原因如下：

1. 减少直接操作真实 DOM 的频率：真实 DOM 的操作非常昂贵，包括创建、更新和删除节点等操作。而虚拟 DOM 允许将多个 DOM 操作进行批处理。在修改虚拟 DOM 时，并不会立即更新真实 DOM，而是先将修改的内容保存在内存中的虚拟 DOM 中。然后，框架会根据需要一次性地将虚拟 DOM 的变更应用到真实 DOM 上。这样可以减少对真实 DOM 的直接操作次数，从而减少了性能开销。
2. 优化 DOM 更新的效率：通过 diff 算法比较新旧虚拟 DOM 的差异，只有真正变化的部分才会被更新到真实 DOM 上。这样可以避免不必要的 DOM 操作，大大减少了浏览器重新渲染的工作量，提高了性能。
3. 批量更新提高渲染效率：由于虚拟 DOM 可以进行批处理，所以可以将多个状态变更合并为一次更新。通过合并操作，可以减少重复的计算和渲染过程。这样不仅减少了不必要的工作量，还避免了频繁的页面重绘，提高了整体的渲染效率。

虚拟 DOM 的提出和应用使得前端框架能够更加高效地管理和更新页面，降低了对真实 DOM 的操作成本，提高了应用的性能和用户体验。