Vue3 源码解读

前言 在 Vue2 中，有一个老生常谈的话题，如何避免 data 中一个复杂对象（自身或属性对象）被默认被创建为响应式（Non-reactive Object）的过程？ 举个例子，有一个 Vue2 的

前言 近期，Vue3 提了一个 Ref Sugar 的 RFC，即 ref 语法糖，目前还处理实验性的（Experimental）阶段。在 RFC 的动机（Motivation）中，Evan You

在 5月22日的 Vue Conf 21 上，尤大在介绍单文件组件（SFC）在编译阶段的优化的时候，讲了 SFC Style CSS Variable Injection 这个提案，即 <s

又回到了经典的一句话：“知其然，而后使其然”。相信大家对 Vue 提供 v-if 和 v-show 指令的使用以及对应场景应该都滚瓜烂熟了。但是，我想仍然会有很多同学对于 v-if 和 v-show 指令实现的原理存在知识空白。 在之前 【Vue3 源码解读】从编译过程，理解静…

在「Vue3」中，创建一个组件实例由 createApp 「API」完成。创建完一个组件实例，我们需要调用 mount() 方法将组件实例挂载到页面中： 开始安装，它会初始化 props、slots、调用 setup()、验证组件和指令的合理性。 结束安装，它会初始化 comp…

上一篇文章，我们讲了「Vue3」 runtime 和 compile 结合的 patch 过程。似乎，由于文章内容太过晦涩的原因，并没有收到很多同学的反馈。但是，其实这里我想说的是源码就是这样，初见时如陌生人一般，再见时如初恋，既熟悉又怀念。 所以，这一篇文章，我打算讲个「Vu…

在上一篇文章中，我们分析了在编译过程静态节点的提升。并且，在文章的结尾也说了，下一篇文章将会介绍 patch 过程。 说起「Vue3」的 patch 过程，其中最为津津乐道的就是靶向更新。靶向更新，顾名思义，即更新的过程是带有目标性的、直接性的。而，这也是和静态节点提升一样，是…

静态节点提升是「Vue3」针对 VNode 更新过程性能问题而提出的一个优化点。众所周知，在大型应用场景下，「Vue2.x」的 patchVNode 过程，即 diff 过程是非常缓慢的，这是一个十分令人头疼的问题。 虽然，对于面试常问的 diff 过程在一定程度上是减少了对 …

前几天写了一篇关于Vue 3.0 reactive API 源码实现的文章，发现大家还是蛮有兴趣对于源码这一块的。阅读的人数虽然不多，但是 200 多次阅读，还是阔以的！并且，也有同学指出了文章存在的不足，就是没有分析 Proxy 是如何配合 Effect 实现响应式的原理，即…

今年，对于从事前端开发的同学而言，很是期待的一件事就是 Vue3.0 的发布。但是，Vue3.0 离发布还是有点时间的，并且正式发布也不代表我们就马上就可以用于业务开发。它还需要完善相应的生态工具。不过正式使用是一码事，我们自己玩又是一码事（hh）。 Vue3.0 特地准备了一…