js底层原理(为什么vue逐步代替jq)

1.操作DOM是昂贵的(操作DOM会导致重排和重绘)
2.js和DOM是两种东西,每次连接都需要消耗性能。
【js和DOM存在不同的文件中,例如chorme,使用webCore库来渲染页面,单js引擎是V8】


浏览器渲染过程:
1.解析HTML,构建DOM树
2.解析CSS,生产css规则树
3.合并DOM树和CSS规则树,生成render树
4.布局render树,负责各元素尺寸、位置的计算
5.绘制render树,绘制页面像素信息
6.浏览器会将各层的信息发送给GUP,GUP将各层合成

(不可见节点:meta、link标签,display:none属性标签)
造成重排的操作:添加或删除可见的dom元素、元素位置改变、尺寸改变、内容改变、页面渲染器初始化、浏览器窗口尺寸改变
触发重排的属性:offsetTop offsetLeft offsetWidth offsetHeight scrollTop scrollLeft scrollWidth scrollHeight clientTop clientLeft clientWidth clientHeight getComputedStyle()
【触发重排一定会触发重绘】
造成重绘的操作:改变颜色等


vue核心是虚拟dom,使用虚拟dom可以减少dom的操作,从而提升应用的性能。

虚拟dom(virtual dom == vdom),所谓虚拟dom,即伪dom,假的dom,他不是一个真实的dom,而是由JS来模拟出来的具有真实dom结构的一个树形结构。

虚拟dom是一个库,snabbdom(https://github.com/snabbdom/snabbdom)


vue的优点有哪些:
1、性能更好
2、视图、数据分离
3、维护成本低


vue是什么?
vue是MVVM框架
js底层原理(为什么vue逐步代替jq)_第1张图片
vue是渐进式的一个框架,可根据目标使用vue不同的功能。
js底层原理(为什么vue逐步代替jq)_第2张图片

你可能感兴趣的:(js底层原理(为什么vue逐步代替jq))