VNode 是什么？什么是虚拟DOM？
Vnode 是 JavaScript 对象，Vnode 表示 Virtual DOM，用 JavaScript 对象来描述真实的DOM把 DOM 标签，属性，内容都变成对象的属性。就像使用 JavaScript 对象对一种动物进行说明一样{name: 'Hello Kitty', age: 1, children: null}。
1）Vnode 的作用
通过 render 将 template 模版描述成 Vnode，然后进行一系列操作之后形成真实的DOM 进行挂载。
2) Vnode 的优点
2-1) 兼容性强，不受执行环境的影响。Vnode 因为是 JS 对象，不管node 还是浏览器，都可以统一操作，从而获得了服务端渲染、原生渲染、手写渲染函数等能力。2-2) 减少操作 DOM，任何页面的变化，都只使用 Vnode 进行操作对比，只需要在最后一步挂载更新 DOM，不需要频繁操作 DOM，从而提高页面性能
什么是虚拟 DOM?
1、文档对象模型或 DOM 定义了一个接口，该接口允许 JavaScript 之类的语言访问和操作HTML 文档。元素由树中的节点表示，并且接口允许我们操纵它们。但是此接口需要付出代价，大量非常频繁的 DOM 操作会使页面速度变的非常缓慢
2、Vue 通过在内存中实现文档结构的虚拟表示来解决此问题，其中虚拟节点（Vnode）表示 DOM 树中的节点。当需要操纵时，可以在虚拟 DOM 的 内存中执行计算和操作，而不是在真实 DOM 上进行操纵。这自然会更快，并且允许虚拟 DOM 算法计算出最优化的方式来更新实际 DOM 结构,一旦计算出，就将其应用于实际的 DOM 树，这就提高了性能，这就是为什么基于虚拟 DOM 的框架（例如 Vue 和 react）如此突出的原因。
本文来自博客园，作者：jialiangzai，转载请注明原文链接：https://www.cnblogs.com/zsnhweb/articles/17512233.html
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· C#/.NET/.NET Core技术前沿周刊 | 第 29 期（2025年3.1-3.9）
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异