关于NUXT2中使用Vuex的疑问：是否应当使用Vuex？

1. 使用Vuex会降低性能吗？ #

正常使用情况下，Vuex不会带来明显的性能损耗。Vuex的响应式机制和Vue组件原生状态管理逻辑一致，仅多了一层状态分发的中间层。只有出现不合理用法时才会影响性能，比如：

• 频繁对大型数组/对象执行无意义的状态变更
• 在getter中编写未缓存的复杂计算逻辑
• 未合理拆分模块导致状态树过于庞大

只要遵循Vuex最佳实践（比如拆分模块、使用mapState/mapGetters简化代码、缓存复杂计算结果），性能影响可以忽略不计。

2. Vuex是否会在服务器端运行？其数据会从服务器端同步到客户端吗？ #

Vuex会在Nuxt2的服务端运行。在Nuxt2的asyncData、fetch钩子中调用Vuex的actions获取数据时，这些操作是在服务端执行的。

服务端执行完成后，会将Vuex的状态序列化为JSON，注入到页面的window.__NUXT__全局对象中。客户端初始化时，Nuxt会自动将这个预渲染的状态同步到客户端的Vuex store中，避免客户端重复请求数据，同时保证SSR页面的前后端状态一致性。

3. 使用Vuex会增加内存占用吗？ #

会，但增加的幅度极小。Vuex本质是维护一个全局的状态树，和将状态分散存储在各个组件中相比，内存占用的差异可以忽略。反而在多组件需要共享相同状态的场景下，Vuex的集中管理能减少冗余状态的存储，降低整体内存占用。

只有当你在Vuex中存储大量未清理的冗余数据（比如过期的列表数据、大文件Blob）时，才会导致内存占用过高。

4. 同一状态存储在Vuex与存储在组件中有什么区别？ #

• 访问范围：Vuex状态是全局可访问的，所有组件都能通过规范的方式读取和修改；组件内状态仅能在当前组件及子组件通过props传递访问。
• 状态流转可控性：Vuex要求通过mutation修改状态、action处理异步逻辑，状态变更全程可追踪，适合复杂业务场景的状态管理；组件内状态变更无强制规范，跨组件传递状态需要依赖emit、事件总线或provide/inject，复杂场景下易出现逻辑混乱。
• SSR适配：Nuxt2中，Vuex状态可以在服务端初始化并同步到客户端，避免客户端重新请求；组件内状态在服务端渲染时无法直接同步到客户端，客户端初始化时会重新创建，可能导致 hydration 不匹配问题。
• 复用性：Vuex的状态和业务逻辑可以在多个组件间复用；组件内状态仅能在当前组件上下文复用，无法直接共享给其他无关组件。

内容的提问来源于stack exchange，提问作者Gleason