写点什么

Vuex3.1.1 更新:支持 jsDelivr,修复内存泄漏

  • 2019-05-23
  • 本文字数:1759 字

    阅读完需:约 6 分钟

Vuex3.1.1更新:支持jsDelivr,修复内存泄漏

JavaScript 已成为庞大、多样化并快速发展的编程语言。每当 JS 的框架或库发布更新,社区中与之相关的项目也会随之作出改进——Vue.js 及其附属项目就是典型例子。


Vuex 是简单直观的状态管理服务,但它的更新步伐是跟随 Vue.js 的,所以有时新版 Vue.js 的功能会迟一些才能获得 Vuex 的支持。


例如,原生移动应用已经广泛流行。许多 JavaScript 项目都有对应的库和框架等组件来开发应用。


和 Vue 类似,NativeScript-Vue 也是一个 NativeScript 插件,让开发者可以使用 Vue 来制作移动应用。Vuex 还可以与 NativeScript-Vue 集成,以便与组件的状态机一起使用,但它缺乏良好的调试机制。


Vuex的3.1.1版本已经开始处理这个问题了。除了支持在 NativeScript 应用中调试 Vuex 之外,这一版更新还有很多改进,例如纳入 jsDelivr CDN npm 包,并修复了模块注册的内存泄漏错误等。这个版本没有重大改动,所以升级项目时无需担心。


你可以查看更新日志和官宣资料、贡献者提交内容来了解更多信息。下面我们具体看一下。

支持在 NativeScript 应用中调试 Vuex

Vue-remote-devtools 是使用 Vue.js 开发 NativeScript 应用的官方 Vue 开发工具应用。它基于 Node.js 和 Chromium,让开发者可以轻松调试 HTML/CSS/JS 应用(这里的例子则是 Vue):



此外,vue-devtools是一个用于调试基于 Web 的 Vue 应用的浏览器扩展,可以与 Vuex 及其状态管理库无缝集成,让开发者可以可视化之前的状态并在它们之间来回切换。这对所谓时间旅行调试的流程非常有用(例如,你可以在各个状态间进退自如)。


但对于 NativeScript 项目来说,这一版本之前是没有这个功能的。现在开发者可以在非浏览器环境下检查 Vuex 状态。如果你不太了解Vuex状态管理,可以参阅此处链接了解更多信息:


https://vuex.vuejs.org/guide/state.html

为浏览器提供的新的缩小器和 ES 模块

在 ES 模块出现之前,开发者通常会将 JavaScript 代码像下面这样导入 HTML 页面:


<script src="https://some-cdn.com/vue.js"></script><script>new Vue();</script>
复制代码


这种导入 JS 库的经典方法有一些缺陷:每次导入的顺序必须是正确的;如果顺序不正确,下面的脚本就会找不到依赖项。这种方法还将对象和函数暴露给了全局命名空间,因此任何人都可以访问并更改它们。此外你还可能犯导入文件两次的错误——缺陷还不止这些。


Vue 就遇到了这个问题。在 2.6 版之前,它在构建过程中没有专门在浏览器中加载 Vue 模块的步骤。所以下面这样的代码是不行的:


<script type=”module” src=”vue.esm.js”></script>
复制代码


结果从 2.6 版开始,因为现在所有人都会在浏览器中使用 ES 模块,Vue 在构建流程中加入了这一步。


此外 Vuex 也面临相同的问题,但到了 3.1.1 版本才得到解决。现在要将 Vuex 直接导入浏览器,只需使用:


<script type=”module” src=”vuex.esm.browser.js”></script>// Or below for the min version<script type=”module” src=”vuex.esm.browser.min.js”></script>
复制代码


此外该版本还加入了名为 Terser 的新的缩小器。这是因为之前的缩小器 UglifyJS 不再维护了,而且后者只支持 ECMAScript 5,Terser支持 ES6+。


对于开发者来说这没什么区别。另外,因为 Terser 是 UglifyJS 的一个分支,所以它保持了对 uglify-es 和 uglify-js@3 的 API 和 CLI 兼容性的支持。

支持 jsDelivr

jsDelivr比大多数CDN都快得多。现在,你还可以从 jsDelivr 导入Vuex

修复注册/注销模块时内存泄漏问题

模块可以把我们的商店分成更小和更可控的部分,因为整个状态包含在 Vuex 中的一个大对象里。要在商店中添加或删除模块,我们只需要分别调用 store.registerModule 或 store.unregisterModule 即可。


但在大型应用中管理浏览器内存可能有点棘手。 这有一个已知问题,需要一个应用程序添加数百个模块并在之后立即取消注册,这导致堆内存未被清除。 你可以想象下一步会发生什么…内存泄漏。


这一版的修复会简单地在函数 resetStoreVM 中对 oldVm 实例做垃圾回收,该函数负责在高峰期活动之后恢复 vm。

小结

完整更新列表可参阅此处(https://github.com/vuejs/vuex/releases),其中还有之前版本的更新介绍。如果你希望了解有关 Vuex 的更多信息,请参阅其官方入门指南:


https://vuex.vuejs.org/guide/


英文原文:


https://blog.logrocket.com/whats-new-in-vuex-3-1-1-d796b0c791bf



2019-05-23 18:165885

评论

发布
暂无评论
发现更多内容

十四五期间我国区块链技术趋势特征分析

CECBC

区块链 大数据

百度Hydra工具在移动端UI兼容性测试上的高效应用

百度Geek说

测试 UI

翻译:《实用的Python编程》01_06_Files

codists

人工智能 后端 python 爬虫 数据结构与算法 文件操作

进程管理:kill命令之-9与-15

程序员架构进阶

Java Linux 进程 七日更 2月春节不断更

LeetCode题解:63. 不同路径 II,动态规划,JavaScript,详细注释

Lee Chen

算法 大前端 LeetCode

Java架构大牛之路必备“微服务架构笔记”

Java架构之路

Java 程序员 架构 面试 编程语言

阿里面试这样问:redis 为什么把简单的字符串设计成 SDS?

程序员小富

Java redis 面试

真牛皮!2021最新Android大厂面试真题大全,BAT大厂面试总结

欢喜学安卓

android 程序员 面试 移动开发

大厂必问算法!查漏补缺LeetCode必考“1024道技术点面试题”

Java架构之路

Java 程序员 架构 面试 编程语言

01 | Mysql基础架构

zach

MySQL

区块链难在落地,亟需补人才缺口迎爬升期

CECBC

区块链

诊所数字化:诊所医护人员绩效指标评估方式

boshi

绩效 数字化转型 医疗 七日更

元旦立下的Flag,春节后该如何实现?

脑极体

OAuth:每次授权暗中保护你的那个“MAN”

华为云开发者联盟

大前端 协议 权限 Oauth web服务

话题讨论 | 今年,你回家过年了吗?

xcbeyond

话题讨论 春节 就地过年

温故而知新!腾讯Android开发面试记录,薪资翻倍

欢喜学安卓

android 程序员 面试 移动开发

5.state更新流程(setState里到底发生了什么)

全栈潇晨

React React Hooks react源码

28天写作再次开启,你准备好来挑战了吗?

TGO鲲鹏会

28天写作 热门活动

探究Python源码,终于弄懂了字符串驻留技术

华为云开发者联盟

Python 字符串 Python解释器 字符串驻留 字符

4.从legacy或concurrent开始(从入口开始,然后让我们奔向未来)

全栈潇晨

React React Hooks react源码

程序员成长第九篇:真实项目中的注意事项

石云升

程序员 项目实战 2月春节不断更

腾讯云大神用这份“redis深度笔记”把Redis入门到精通全部精髓全部展现出来了

redis 架构 计算机

如何提升网页核心指标

Vincent

新闻|2021 FOSDEM为期两天的活动成功举办,一大波学习资源来袭!

PostgreSQLChina

数据库 postgresql 软件 开源社区

offer稳了!四面阿里面经分享,定级P6之路。

Java架构之路

Java 程序员 架构 面试 编程语言

6.render阶段(厉害了,我有创建Fiber的技能)

全栈潇晨

React React Hooks react源码

电信的标准化组织

Geek_古藤模根

标准化 电信

技术需求文档,应当这么写!

穿甲兵

需求 文档

我用 go-zero 一周实现了一个中台系统,已开源!

万俊峰Kevin

微服务 go-zero Go 语言

资本之外,区块链破圈正当时

CECBC

区块链

【LeetCode】K 连续位的最小翻转次数Java题解

Albert

算法 LeetCode 2月春节不断更

Vuex3.1.1更新:支持jsDelivr,修复内存泄漏_语言 & 开发_Diogo Souza_InfoQ精选文章