欢迎光临散文网 会员登陆 & 注册

Vue.js 3.0源码解析

2023-07-23 09:55 作者:流浪在银河边缘的阿强  | 我要投稿

链接:https://pan.baidu.com/s/1ffG-ZihRNgzDvOy4uvR5Bg?pwd=16os 

提取码:16os

Vue3是Vue的3.x版本,是在Vue 2.x的基础上迭代出来的“大”版本,它对整个Vue库进行了重写和升级。与Vue2相比,虽然Vue3的核心逻辑变化不大,但是针对包架构进行了升级,由原来的options API挂载原型的方式变为composition API方式,从而实现各核心库的解耦,使得Vue3的内部核心模块可以按需加载。

本书帮助广大读者在使用Vue3的过程中理解实现原理,学习Vue3实现逻辑。通过对Vue3运行原理的解析,帮助读者理解核心源码的实现。本书由浅入深展开以下内容:


Vue3概述;

Vue3整体实现;

虚拟DOM;

响应式API;

生命周期;

模板编译;

组件和API实现;

整体架构;

实战案例。

本书配有视频、课件、大纲和代码。


作者简介

张廷杭 中国移动通信集团有限公司系统开发工程师,长期从事微信小程序、Web前端开发等工作,对微信小程序、HTML5和Vue前端开发框架等有深入研究。

目录

第1章初识Vue3


1.1Vue3简介


1.2Vue3的变化


1.2.1架构变化


1.2.2代理方式变化


1.2.3Virtual DOM变化


1.3Vue3结构


第2章Vue3入门


2.1createApp()函数


2.2参数响应式


2.3effect副作用函数


2.4mount()函数


2.5patch()函数


2.6总结


第3章Vue3整体实现


3.1源码调试


3.1.1代码调试


3.1.2开启sourceMap


3.1.3总结


3.2createApp()函数


3.2.1涉及文件


3.2.2调用createApp()函数


3.2.3调用createRenderer()函数


3.2.4总结


3.3mounted挂载


3.3.1涉及文件


3.3.2创建根组件VNode


3.3.3递归渲染


3.3.4创建组件上下文实例


3.3.5patch子树


3.3.6总结


3.4setup函数


3.4.1涉及文件


3.4.2mountComponent()函数


3.4.3setupComponent()函数


3.4.4初始化代理上下文


3.4.5get方法


3.4.6set方法


3.4.7has方法


3.4.8调用setup函数


3.4.9finishComponentSetup()函数


3.4.10总结


3.5update方法


3.5.1涉及文件


3.5.2setupRenderEffect()函数


3.5.3updateComponentPreRender()函数


3.5.4updateComponent()函数


3.5.5shouldUpdateComponent()函数


3.5.6processElement()函数


3.5.7patchChildren()函数


3.5.8总结


3.6unmount方法


3.6.1涉及文件


3.6.2baseCreateRenderer()函数


3.6.3ref数据


3.6.4keepalive组件


3.6.5component组件


3.6.6suspense组件


3.6.7telport组件


3.6.8动态子组件等


3.6.9总结



第4章虚拟DOM


4.1VNode对象


4.1.1VNode简介


4.1.2VNode声明


4.1.3_createVNode()函数


4.1.4总结


4.2patch函数


4.2.1patch介绍


4.2.2text类型


4.2.3comment类型


4.2.4static类型


4.2.5fragment类型


4.2.6element类型


4.2.7component类型


4.2.8teleport类型


4.2.9suspense类型


4.3diff比较


4.3.1从前往后比较


4.3.2从后往前比较


4.3.3新增新VNode


4.3.4删除旧VNode


4.3.5进一步判断


4.3.6总结


第5章响应式API


5.1reactive响应式API


5.1.1使用方式


5.1.2兼容写法


5.1.3reactive()函数


5.1.4createReactiveObject()函数


5.1.5mutableHandlers()函数


5.1.6createGetter()函数


5.1.7createSetter()函数


5.1.8ref解析


5.1.9总结


5.2effect副作用函数


5.2.1实现


5.2.2mount(挂载)


5.2.3update(更新)


5.2.4创建effect副作用函数


5.2.5ReactiveEffect()函数


5.2.6处理激活状态


5.2.7清除操作


5.2.8执行fn


5.2.9总结


5.3watch监听


5.3.1watch函数


5.3.2初始化


5.3.3scheduler异步队列


5.3.4watchEffect()函数


5.3.5总结


5.4computed函数


5.4.1创建getter副作用函数


5.4.2创建cRef


5.4.3总结


5.5拓展方法


5.5.1customRef()函数


5.5.2readonly()函数


5.5.3shallow()函数


5.5.4shallowReactive()函数


5.5.5shallowReadonly()函数


5.5.6总结


第6章生命周期


6.1生命周期函数


6.1.1执行顺序


6.1.2生命周期实现


6.1.3injectHook()函数


6.1.4总结


6.2挂载回调


6.3更新回调


6.4卸载回调


6.5onErrorCaptured()钩子函数


6.6onRender钩子函数


第7章模板编译


7.1模板渲染


7.2生成AST对象


7.2.1初始化解析函数


7.2.2初始化上下文


7.2.3根节点对象


7.2.4标签解析


7.3AST对象优化


7.3.1transform()函数


7.3.2静态变量提升


7.4生成代码字符串


7.4.1创建模板字符串上下文


7.4.2生成引用函数


7.4.3生成函数签名


7.4.4判断是否需要with函数扩展作用域


7.4.5资源分解处理


7.4.6生成节点代码字符串


7.4.7返回代码字符串


7.5生成render函数


7.6位运算


第8章组件和API实现


8.1Suspense


8.2teleport


8.3KeepAlive


8.4slot


8.5props


8.6defineAsyncComponent


8.7defineComponent()


8.8directives


8.9scheduler


第9章整体架构


9.1架构设计


9.2打包工具


9.3构建工具


第10章实战案例


10.1案例介绍


10.1.1项目介绍


10.1.2知识点介绍


10.2Vue3核心实战


10.2.1登录页面


10.2.2注册页面


10.3Vue3模板编译实战


10.3.1首页页面


10.3.2个人资料页面


10.4Vue3功能实战


10.4.1写作页面


10.4.2个人主页


参考文献


查看全部↓


Vue.js 3.0源码解析的评论 (共 条)

分享到微博请遵守国家法律