2020/02/10/deep-into-vue-ssr
utterances-bot opened this issue · 1 comments
Vue 服务器端渲染(SSR)源码分析 | Harttle Land
本文从框架开发者而非使用者的角度,学习和探讨 Vue SSR 的源码。希望能让更多人理解 SSR 魔法的工作原理和实现思路。因此本文不会介绍最终接口的详细参数,如 createRenderer() 的具体参数、createBundleRenderer...
博主你好,我最近研究Vue状态管理,发现了这篇好文章!有个想法想探讨一下:
在 Vue 3, Vuex 4 以及 Pinia 当中,都是用 useStore()
的方式,在 setup
内创建 store 实例,而不是创建全局单例,import之后直接使用。这样用起来就稍微麻烦一些,也不方便用在 Vue 2 options 写法中。
出于好奇,我在官方讨论区提了这个问题,得知是因为 SSR 需要避免有状态的单例:
vuejs/rfcs#270 (comment)
之后我发现,Vue SSR 提供 runInNewContext 选项,可以解决有状态单例的问题,只是渲染速度比较慢。继续深入,发现是 vm.createContext
这个调用慢了:https://zhuanlan.zhihu.com/p/285808027
那么,如果把 context 做成 context pool ,每个 context 用完之后重置全局对象的状态,放回 pool 重复使用,不就可以显著提高性能吗?全局对象基本就是 Vue app 和 Vuex store,重置状态也很好实现。
大致看了一下 Vue SSR 的部分源码,似乎也不难实现。你觉得这个思路如何?欢迎拍砖。
https://github.com/vuejs/vue/blob/dev/src/server/bundle-renderer/create-bundle-runner.js