遵循惯例,还是先抛几个问题:
- Vue运行实例中存在几棵树,或者说存在几个树形结构,例如有Dom树,当然因为Vue使用的是虚拟dom,也存在一个vnode树型结构,除了这两棵树之外,还有其他树吗?
- Vue中的这几个树形结构的关系是什么?是怎么关联起来的?
- 在一个有很多组件和大量vnode的Vue实例中,如何评估测量性能,例如,只更新最高层组件的一个很小的变量,会影响到那些vonde的diff?
- Vue的slot的机制和原理是什么,比较一下Vue Slot机制和Web Component的机制原理。
下面的这三个资料可以回答上面的这几个问题。
Vue 技术内幕:
Vue 技术内幕:hcysun.me/vue-design/
Vue 技术揭秘:
Vue 技术揭秘:ustbhuangyi.github.io/vue-analysi…
Vue 源码学习:
Vue 源码学习:blog.windstone.cc/vue/source-…
Vue 技术内幕写的最详细,作者说逐行解析,确实是这样的,好多细节都是独家提供,遗憾的是,内容不是很全,没有详细地说明组件化,Vue的一些难点,例如slot的机制都没有描述。
Vue技术揭秘的作者是Vue届的大佬,写的很早,有配套的视频课程,内容很全,Vue 中所有的点都有涉及,个人感觉的不足之处是写的不是很详细。
上述两个源码解析的资料应该是知名度最高的,都值得学一遍。
个人感觉最被低估的是第三个学习资料Vue 源码学习,可能我孤陋寡闻,从github上的star数量来看,知名度不高,不过内容写的真的很棒。
持续更新中。。