Vue3 源码学习(一):三大系统

232 阅读1分钟

真实 DOM 渲染

书写 HTML 代码,浏览器解析成真实的 DOM

虚拟 DOM 的优势

  1. 操作 vnode 要比直接操作真实的元素节点更简单。

  2. vdom 更方便实现跨平台。

Vue 三大核心系统

Vue 的源码包含三大核心:

  • Compiler 模块:模板编译系统,用来将模板编译成 render 函数;

  • Runtime 模块:也可以称之为 Renderer 模块,真正渲染的模块,将 vnode 渲染成真实的 DOM;

  • Reactivity 模块:响应式系统;

实现 Mini-Vue

这里我们实现一个简洁版的 Mini-Vue 框架,该 Vue 包括三个模块:

  • 渲染系统模块:将 vnode 渲染成真实的 DOM;

  • 可响应式系统模块

  • 应用程序入口模块