vue原理

组件化

数据驱动视图
传统组件，只是静态的渲染，更行还是依赖于操作DOM
数据驱动视图--Vue(MVVM)
数据驱动视图--React(setState)

响应式

核心API definedProperty getter和setter 深度监听
对数组的监听 重新定义原型

vdom和diff

模版编译

模版编译为一个render函数，执行render函数返回vnode
基于vnode再执行pacth和diff
使用webpack vue-loader ，再开发环境下编译模版

渲染过程

• 初次渲染
  解析模版为render函数(或在开发环境已完成，vue-loader)
  触发响应式 监听data属性的getter和setter
  执行render函数生成vnode 再进行pacth(elem, vnode)
• 更新过程
  修改data触发setter(此前再getter中监听)
  重新执行render函数，生成newVnode
  patch(vnode, newVnode)
• 异步渲染

前端路由