Virtual DOM详解

  • Virtual DOM定义:
	简单解释:
			本质来说:Virtual DOM是一个JavaScript对象,通过对象的方式来表示DOM结构.
		将页面的状态抽象为JS对象的形式,配合不同的渲染工具,使跨平台成为了可能.
		通过事务处理的机制,将多次DOM的修改结果一次性的更新到页面上,从而有效的
		减少页面的渲染次数,减少修改DOM的重绘重排次数,提高渲染的性能.
	更本质解释:
			虚拟DOM是对DOM的抽象,这个对象是更加的轻量级的DOM的描述.它设计的最初的
		目的,就是为了更好的跨平台.举个例子,Node就没有DOM,想要实现SSR,那个一个
		方式就是借助虚拟DOM,因为虚拟的DOM本省就是JS对象.在代码渲染到页面之前,
		vue或者React会把代码转换成一个对象(虚拟DOM).以对象的形式来描述真实DOM
		结构,最终渲染到页面.在每次数据发生变化前,虚拟DOM就会缓存一份,变化之前,
		现在的虚拟DOM会与缓存的虚拟DOM进行比较.
		
			在Vue或React中内部封装了diff算法,通过这个算法来进行比较,渲染时修改
		改变的变化,原先没有发生变化的通过原先数据进行渲染.
		
			最重要的一点,前端的框架的一个基本要求就是无需手动操纵DOM,一方面时
		因为手动操作DOM无法保证程序性能,多人协作的项目中如果review不严格,
		可能会有开发者写出性能较低的代码,另一方面更重要的是省略手动操作DOM
		可以大大的提高开发的效率.
			
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值