模块二：学会新设计：Composition API

04 | Setup：组件渲染前的初始化过程是怎样的？

Vue.js 在 Web 端的两个版本：

• runtime-only 使用 SFC（单文件组件）开发组件，即通过编写 template 模版来描述一个组件的 dom 结构。 .vue 文件不可以直接在 web 端运行，需要 webpack 使用 vue-loader 将它编译生成组件相关的 JavaScript 和 css，并把 template 部分转换成 render 函数添加到组件属性中。
• runtime-compiled 不借助 webpack 编译，直接引入 Vue.js ，在组件对象 template 属性中编写组件的模版，然后运行时编译生成 render 函数。

建议使用第一种，迫不得已的老项目可以使用第二种。 runtime-only 和 runtime-compiled 的主要区别在于是否注册了这个 compile 方法

05 | 响应式：响应式内部的实现原理是怎样的？（上）

响应式的本质就是：当数据发生变化时，自动执行某个函数，映射到组件就是当数据发生变化时，自动触发组件重新渲染。

在 Vue.js 2.x 中，Watcher 就是依赖，有专门针对组件渲染的 render watcher。注意这里有两个流程，首先是依赖收集流程，组件在 render 的时候会访问模板中的数据，触发 getter 把 render watcher 作为依赖收集，并和数据建立联系；然后是派发通知流程，当我对这些数据修改的时候，会触发 setter，通知 render watcher 更新，进而触发了组件的重新渲染。