上一篇文章中，我们从 packges/vue/src/index.ts 的入口开始，了解了一个 Vue 对象的编译流程，在文中我们提到 baseCompile 函数在执行过程中会生成 AST 抽象语法

这篇文章主要参考了 Vue.js 核心成员 Guillaume Chau 在 19 年美国的 Vue conf 分享的主题：9 Performance secrets revealed，分享中提到了九个 Vue.js 性能优化的技巧。 我看完他的分享 PPT后，也阅读了相关的项…

1. Vue2的局限性 2. 如何使用CompositionAPI解决问题 最佳的解决方法是将逻辑聚合就可以很好的代码可读性。 这就是我们的CompositionAPI语法能够实现的功能。CompositionAPI是一个完全可选的语法与原来的OptionAPI并没有冲突之处。…

作为一枚有追求的武者，我还是想从原理上给大家弹一弹到底为什么会有这些限制和约束，正所谓知其然知其所以然。 结论：到这里我们知道了vue3对setup和其他选项的处理逻辑：如果设置了setup则先调用它，随后再处理别的options。 结论：所以setup中的this就是它执行时…

但是很快我们又蒙圈了，这个组件实例和我们以前熟悉的this不一样，直接访问this.foo还是找不到数据。 当然坑还是有的，你仔细观察这个ctx，发现它不是一个Proxy对象，也就是这位兄台只有值却没有响应性，所以如果要利用响应特性，还得用proxy这个属性返回上下文对象，如果…

install方法的作用是将store这个实例挂载到所有的组件上，注意是同一个store实例。 Store这个类拥有commit，dispatch这些方法，Store类里将用户传入的state包装成data，作为new Vue的参数，从而实现了state 值的响应式。 现在我们…

面试的时候经常被问一些Vue源码相关的问题，通常情况下， 我会在面试前恶补掘金上的面筋来对付面试，什么双向绑定的原理呀，什么虚拟dom树呀，实际上我压根儿就没仔细研究过，其一是自己真的比较菜，其二工作上也用不上，别自己给自己添堵。但后面想一下，很多事情，为之则易，不为则难，给自…

发现图片无法显示，打开控制台审查元素，发现路径并没有正确解析，这个跟 webpack 编译打包有关系，在编译过程中目录结构改变导致的。 配置路由的时候，开发环境下不需要使用 lazy-loading 加载 , 仅在生产环境使用即可，因为开发模式使用 lazy-loading 会…

Vue组件可能存在多个实例，如果使用对象形式定义data，则会导致它们共用一个data对象，那么状态变更将会影响所有组件实例，这是不合理的；采用函数形式定义，在initData时会将其作为工厂函数返回全新data对象，有效规避多实例之间状态污染问题。而在Vue根实例创建过程中则…