渲染器原理及实现 完整目录 渲染器原理及实现 1. 编译器和渲染器 API 初探 Complier 和 Renderer 编译器(Complier)真实场景 2. 设计 VNode 用 VNode 描述 HTML 用 VNode 描述抽象内容 区分 VNode 类型 区分 children 的类型 定义 VNode 3. 生成 VNode 的 h 函数 基本的 h 函数 完整的 h 函数 4. 渲染 VNode 的 mount 函数 mount 函数基本原理 解决 VNode 的类型问题 渲染文本节点 渲染标签节点 渲染普通有状态组件 渲染函数式组件 设置 DOM 属性 渲染子节点 关联 VNode 及其 DOM 完整实现 完整示例 5. 实现 patch 函数 patch 的作用 patch 函数实现 比较 props 比较 children 完整实现 完整示例 6. patch 函数优化 准备工作 简单的 diff 算法 优化版本的 diff 算法 新增节点 删除节点 关于核心 diff 算法 Vue 2 diff 算法 Vue 3 diff 算法 本章节将带你实现Vue 3的渲染器功能,分为如下几部分来讲解。 1. 编译器和渲染器 API 初探 点此学习 2. 设计 VNode 点此学习 3. 生成 VNode 的 h 函数 点此学习 4. 渲染 VNode 的 mount 函数 点此学习 5. 实现 patch 函数 点此学习 6. patch 函数的优化 点此学习 下一章 - Reactivity响应式设计