vue 两大核心

·  阅读 79

vue 两大核心

组件化系统响应式数据系统

组件化系统

组件化系统不是vue独创的,在早期,前后端没有分离开发时候,数据是由后端拼接好,前端直接俄渲染,然后浏览器加载已经贴好数据的静态文件。早期页存在组件化开发。 当页面发生交互时候,需要通过js操作dom,如果交互过于复杂,需要考虑dom,以及优化dom优化流程,但是这个一般人做不好。 vue底层对操作是虚拟dom,减少了操作dom次数,提高了性能,并且做掉兼容IE8。使用vue不需要考虑底层优化和兼容性问题,提高了开发效率

vue创建了MVVM 响应式数据系统,解决了兼容与性能两大问题,

  • Module 指定的数据,在vue中存放数据的有 data vuex vue.observe 等,通过ViewModule中指定/事件等,将Module数据渲染View层,当view层视图发生变化时,ViewModule 也会修改Module中,实现Vue中响应是数据系统,开发者不需要考虑如何操作DOM,应该考虑一下情况
  • 1 数据的基本处理,那些是响应式数据,那些是非响应式数据
  • 2 数据污染等问题;
  • 3:大量数据问题如何优化,例如分页处理。

实现思路:

  • 通过Object.defineProperty() 以及发布订阅者模式实现的响应式数据系统
  • 通过 proxy 代理方式实现,存在兼容性问题。

源码实现方式:

  • data 通过Observer 转化为 getter/setter 的形式来追踪。
  • 外界通过wather读取数据,会触发getter从而将watcher添加到依赖中
  • 当数据变化时候,会触发 setter从而向Dep中的依赖(watcher)发送通知
  • watcher 接收到通知后,向外界发送通知,变化通知到外界后可能触发视图更新某个回调函数中。
分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改