vue原理

vue是一个渐进式的框架, 采用的是自底向上的增量开发模式, vue和Angela不一样, vue是轻量的, Angela是全家桶, Angela非常大, 不过功能非常完善, 是一整套的, vue只是一个vue.js库, 你想要路由功能的话还要安装vue-router库这是他两个之间的区别, react和vue差不多轻量, 不过语法什么的有差异
vue的核心之一的数据双向绑定是使用了Object.defineProperty实现的, 他的作用是给指定的属性定义一个get函数和set函数, 函数的意思跟名字是一样的, 在用户触发数据变动的时候vue把监听函数加在了set函数里面, 导致数据变动的时候就会触发一次监听函数, 在监听函数里面对绑定的dom元素和其他的东西比如说watch和计算属性的更新, 这样就实现了一个双向绑定, 不过有的时候他的这个监听也不是太好使, 由于实现双向绑定采用的api有兼容性问题, 所以只支持ie9+
在就是核心之一的虚拟dom, 这一点vue和react采用的方案都差不多, 不过react的运行速度要比vue快很多, 由于原生的dom节点用不到的属性太多了(document.createElement创建的)要是遍历这个东西的话太耗费性能, 所以就有了虚拟dom, 虚拟dom是用javascript对象模拟的, 其中只包含用的到的属性, 所以进行遍历对比的时候就要快很多, 由于vue在数据变动的时候就要更新页面, 但是vue不知道具体什么东西变化了, 所以只能是把变化的属性关联的东西都从新渲染一下, 这个渲染并不是吧原来的东西删了在新创建一个, 而是把新的数据组装成的虚拟dom和原来渲染过的虚拟dom进行一个对比, 把差异的地方渲染到页面上, 这个对比的过程就叫diff算法

猜你喜欢

转载自blog.csdn.net/ccmedu/article/details/80048914