Rspack
v1.2 已经正式发布
!
值得关注的变更如下:
-
-
支持持久化缓存
:实验性功能,让热启动性能提升高达
250%
-
-
-
更快的 code splitting
:实验性开关,显著提升 code splitting 性能
-
-
-
-
-
新功能
支持持久化缓存
在 Rspack v1.2 中,我们实验性地支持了持久化缓存,其会将构建中的缓存信息写入到存储介质中,加速下次 Rspack 的启动速度。
module.exports = {
cache: true,
experiments: {
cache: {
type: 'persistent',
},
},
};
当构建命中缓存时,它可以在真实项目中带来高达 250% 的性能提升。
项目类型
|
模块数量
|
Normal dev
|
Cold dev
|
Hot dev
|
初始项目
|
26
|
146 ms
|
149 ms (+2%)
|
134 ms (-8%)
|
包含 10000 个模块的项目
|
10040
|
2.43 s
|
2.43 s (+0%)
|
1.16 s (-52%)
|
包含 Less 文件的中型项目
|
1898
|
3.47 s
|
3.55 s (+2%)
|
0.92 s (-73%)
|
大型真实项目
|
45968
|
93.3 s
|
91.9 s (-1%)
|
26 s (-72%)
|
需要注意的是,持久化缓存目前仍处于实验阶段,当前仅支持构建过程中的 make 阶段(包括模块解析、转换等流程)。未来我们将持续优化,进一步提升缓存的性能和覆盖范围。
如果你在使用持久化缓存时遇到任何问题,欢迎通过 GitHub Issues 反馈。
详情请参考
experiments.cache
[5]
。
支持 Yarn PnP
Rspack 迎来了对
Yarn PnP
[6]
的支持,其默认根据
process.versions.pnp
(即应用在 Yarn PnP 环境中运行时)来进行开启,也可以将
resolve.pnp
配置为
true
来强制开启。
module.exports = {
resolve: {
pnp: true,
},
};
在此特别感谢
@arcanis
[7]
(Yarn 的维护者),为 Rspack 的 resolver 实现了 PnP 解析。
详情请参考
resolve.pnp
[8]
。
性能优化
更快的 code splitting
在之前的 Rspack 版本中,code splitting 算法在 HMR 下会占用大量的耗时,在 Rspack v1.2 中,我们实现了全新的 code splitting 算法,它支持多线程,增量构建效率更高。如果你的代码库包含大量动态导入,code splitting 可能会花费大量时间,开启这项新功能可以显著提高 code splitting 的性能。
module.exports = {
experiments: {
parallelCodeSplitting: true,
},
};
详情请参考
experiments.parallelCodeSplitting
[9]
。
Watch 范围变化
Rspack v1.2 将不再监听
node_modules
和
.git
目录下的文件变动,这将显著减少监听的文件数目并带来性能提升。
通过
benchmark 仓库
[10]
中的数据,这项调整将:
这个变更不会影响 monorepo 中的符号链接资源,因为 Rspack 默认将符号链接资源解析为它的真实路径。
如果你倾向于保持之前的行为,可以设置 :
module.exports = {
watchOptions: {
ignored: [],
},
};
详情请参考
watchOptions.ignored
[11]
。
减少内存使用
我们优化了在
rspack-sources
[12]
计算过程中用于存储字符串的数据结构。在整个计算过程中,所有字符串数据都指向根节点的字符串堆内存,有效避免了计算过程中产生新的字符串分配。
详见:
perf: reduce memory consumption of CachedSource
[13]
。
更小的压缩体积
Rspack v1.2 将 SWC 压缩器的默认
passes
设置为
2
,以减少 1%-7% 的打包体积。
new rspack.SwcJsMinimizerRspackPlugin({
minimizerOptions: {
compress: {
// 在之前的版本中默认为 1
passes: 2,
},
},
});
passes
[14]
是运行压缩的最大次数。在某些情况下,多次压缩可以产生更小的代码。考虑到 Rspack 本身的性能优势,我们将默认值设为
2
以在构建性能和打包体积之间取得最佳平衡。
详见:
feat: set default SWC minimizer passes to 2 to reduce bundle size
[15]
。
更快的副作用优化
我们对副作用优化的实现进行了重构,采用了更简洁且更易并行化的方案。通过充分利用多线程并行处理能力,在测试项目中,这个阶段的性能获得了 2-3 倍的提升。
详见:
perf: parallelize side effects optimization
[16]
。
生态系统
Angular 支持
Nx 团队的核心成员
Colum Ferry
[17]
为 Rspack 生态带来了完整的 Angular 支持。
通过新发布的
@ng-rsbuild/plugin-angular
和
@ng-rspack/build
包,开发者现在可以使用 Rspack 或 Rsbuild 来构建 Angular 应用,获得更快的构建性能和模块联邦等特性。
欢迎访问
ng-rspack-build
[18]
仓库了解详细信息。
Rsbuild v1.2
Rsbuild v1.2 已经与 Rspack v1.2 同步发布,并带来了多项新特性:
-
通过 output.manifest.generate
[19]
来自定义 manifest 文件的生成。
-
通过 cleanDistPath.keep
[20]
来指定在产物目录下保留的文件。
-
@rsbuild/plugin-assets-retry
[21]
现在会生成更小的运行时代码。
详情请参考
Rsbuild v1.2.0
[22]
。
升级指南
升级 SWC 插件
在 Rspack v1.2 中,Rust 依赖包
swc_core
的版本已升级到
10.1.0
。SWC Wasm 插件的用户需要确保与正在使用的
swc_core
版本一致,否则可能会导致意外问题。
详情请参考
常见问题 - SWC 插件版本不匹配
[23]
。
WarnCaseSensitiveModules 默认关闭
WarnCaseSensitiveModulesPlugin
[24]
插件用于检查模块的路径,并对路径全部为小写的冲突模块发出警告。Rspack 过去默认启用它,但由于它只是一个 linter 插件,并且它在开发模式下会产生额外的性能开销。所以现在 Rspack 默认禁用了这项功能。
如果你倾向于保持之前的行为,可以设置:
module.exports = {
plugins: [new rspack.WarnCaseSensitiveModulesPlugin()],
};
[1]
@jerrykingxyz:
https://github.com/jerrykingxyz
可阅读原文查看更多:https://rspack.dev/zh/blog/announcing-1-2
目前建有
江西|湖南|湖北|河南
籍 前端群,还有
北上广深杭
等城市地区群和
源码共读
群,想进群的可以
点此扫码加我微信 ruochuan02
进群
。
分享
、收藏、点赞、
在看
我的文章,
星标我的公众号:若川视野
就是对我最大的支持~