Vue3源码学习

前面几篇走完了createApp的流程，理清了diff算法的思路。现在回归到运行时的核心API上。在第一篇和第二篇中有解读过watch和computed，而本文则主要梳理异步组件的API。

上一篇中，我们理清了createApp走的流程，最后通过createAppAPI创建了app。app上的各种属性和方法也都已经有所了解。

前面几篇介绍的大都是reactivity相关的API。我们在使用Vue3作为前端框架时，往往在我们的main.js/main.ts里来创建vue3的app实例，就会用到createApp这个API。

KeepAlive是个抽象组件，自身不会渲染一个 DOM 元素，也不会出现在父组件链中，我们用它来缓存组件的状态。KeepAlive只对插入的单个组件起效果，因此一般只给它安排一个组件。

前面几篇文章里，介绍几个API的时候，我们发现里面常出现effect、track和trigger，虽然简单说了下track用于依赖收集，trigger来触发更新。

我们知道，一般用reactive来定义一个响应式对象，ref常用来定义一个响应式的原始值。上篇文章已经聊过了reactive，知晓了如何通过Proxy来对目标对象进行代理从而实现响应式

上次一起阅读了watch和computed的源码，其实应该先看副作用effect，因为各个响应式的API里基本都用到了，等结束了reactive和readonly和ref，就一起看看effect。

想起上次面试，被问了个古老的问题：watch和computed的区别。多少有点感慨，现在已经很少见这种耳熟能详的问题了，网络上八股文不少。今天，我更想分享一下从源码的层面来区别这八竿子打不着的两者。

想起上次面试，问了个古老的问题：watch和computed的区别。多少有点感慨，现在已经很少见这种耳熟能详的问题了，网络上八股文不少。