光笺飞语

这里介绍了ref、computed、watch和render之间的关系，它们可以简单的归为发布者或订阅者，关系是收集和被收集，信息或数据流向是指向收集和通知的方向，响应式体系围绕着发布订阅者模式展开。

侦听器指的是，数据发生变化时，会触发被监听的事件（比如：更改 Dom，修改另一些数据等）。以下是watch相关的实现原理：

计算属性指的是，数据是由其他数据的复杂计算所得。以下是computed相关的依赖收集和派发更新的实现原理：

响应式指的是，当数据发生变化时，视图会跟着变化。以下是以reactive 为例介绍响应式入口、依赖收集和派发更新的实现原理：

使用vue3的过程中，会有很多经典而又好用的功能。 每一个功能也许我们都能运用得炉火纯青。 甚至某个知识点的原理我们也能娓娓道来。 那么，我们可否能将所有的功能的底层逻辑绘制成一个体系树？

文接上篇的第一步，我们从两个尺度简单介绍解析器针对字符串转换成ast树的过程：通过指针挨个扫描字符，通过指针扫描每行代码。

接上篇，Component.render = compile$1(template, finalCompilerOptions)中的compile就是compileToFunction。

是vue底层或者npm run build时框架loader已经帮我们把template转换成了render函数。接下来我们先介绍template生成render 的调试方式...

vue3底层做了很多优化，其中diff算法是被津津乐道的优化策略之一，也是作为前端面试的选题之一。接下来希望能够以简洁的方式介绍明白这件事儿：