1. 前言

1. 源码讲解,有助于提升自己的综合实力

2. 来个图示

1. 
   渲染流程.jpg
2. 初始化调用 $mount 挂载组件。
3. _render 开始构建 VNode，核心方法为 createElement，一般会创建普通的 VNode ，遇到组件就创建组件类型的 VNode，
   否则就是未知标签的 VNode，构建完成传递给 _update。
4. patch 阶段根据 VNode 创建真实节点树，核心方法为 createElm，
   4.1 首先遇到组件类型的 VNode，内部会执行 $mount，再走一遍相同的流程。
   4.2 普通节点类型则创建一个真实节点，如果它有子节点开始递归调用 createElm，使用 insert 插入子节点，直到没有子节点就填充内容节点。
   4.3 最后递归完成后，同样也是使用 insert 将整个节点树插入到页面中，再将旧的根节点移除。

3. vue3 组件挂载后发生 事情

1. 编译：Vue 模板被编译为了渲染函数：即用来返回虚拟 DOM 树的函数。这一步骤可以通过构建步骤提前完成，也可以通过使用运行时编译器即时完成。
2. 挂载：运行时渲染器调用渲染函数，遍历返回的虚拟 DOM 树，并基于它创建实际的 DOM 节点。这一步会作为响应式副作用执行，因此它会追踪其中所用到的所有响应式依赖。
3. 更新：当一个依赖发生变化后，副作用会重新运行，这时候会创建一个更新后的虚拟 DOM 树。运行时渲染器遍历这棵新树，将它与旧树进行比较，然后将必要的更新应用到真实 DOM 上去。
4. 
   渲染流程

参考资料

vue3 渲染

初心

我所有的文章都只是基于入门，初步的了解；是自己的知识体系梳理;如有错误,欢迎交流;

如果能帮助到有缘人,非常的荣幸,一切为了部落的崛起;

共勉