logo
blog
readme
Back to Blog
Back to Blog
Back to Blog

‌

‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌
‌

© 2025 linzhe. All rights reserved.

TODO:编辑

手写mini-vue系列

为了更深入地了解 Vue 相关的原理,实现了 mini 系列的Vue 2 和 Vue 3 的响应式原理,及其对应的 mini 版 Vuex 和 Vue Router。

1、手写 vue2 响应式原理
2、手写 vue3 响应式原理
3、手写 mini-vue3-vue-router(vue-router@4)
4、手写 mini-vue3-vuex(vuex@4)
5、手写 mini-vue2-vue-router(vue-router@3)
6、手写 mini-vue2-vuex(vuex@3)

比较重要的异步代码执行流程,不考虑异步组件

  • vue3中的运行时runtime-core,基本所有的逻辑都是同步执行的,和调度器相关的代码才是异步执行的

  • 比如 组件渲染函数的 副作用 effect.scheduler = () =- queueJob(job)

  • 比如 组件mounted hook, updated hook =- queuePostRenderEffect(m/u, parentSuspense)

    其实这个生命周期的执行顺序还有个bug: https://github.com/vuejs/core/pull/12482#issue-2700674082

  • 比如 watch 的 flush 参数