讲讲Vue的虚拟DOM,原理,好处是什么?相对于手动操作DOM,性能更好吗?

虚拟dom本质上是js对象,是对真实dom的抽象,在状态变化时,记录新树和旧树的差异,最后把差异更新到真实dom中

虚拟dom将dom的对比放在了js层,通过对比不同之处来选择新的渲染节点,从而提高渲染效率

优缺点:

虚拟dom能保证下限,通过diff算法找出最小差异,然后批量patch,这样虽比不上手动优化,但相较于粗暴的dom操作性能要好很多,保证了性能

无需手动操作

跨平台: 虚拟DOM本质上是JavaScript对象,而DOM与平台强相关,相比之下虚拟DOM可以进行更方便地跨平台操作,例如服务器渲染、移动端开发等等

无法进行极致优化,在一些要求极高的应用中虚拟dom无法极致优化,需要手动操作

 

为什么要使用虚拟节点?

频繁的DOM操作会导致大量页面元素的重绘和回流,处于性能优化的考虑我们应该减少重绘和回流的操作。而对虚拟节点的DOM操作,并不会触发重绘和回流,把处理后的虚拟节点映射到真是DOM上,只需要进行一次重绘和回流,提高了性能。

posted @   天青色等烟雨灬  阅读(1061)  评论(0编辑  收藏  举报
(评论功能已被禁用)
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 25岁的心里话
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
点击右上角即可分享
微信分享提示