Blazor WASM项目Release构建体积过大,已开启裁剪仍未生效该如何解决?
问题描述
我创建了一个Blazor项目用于应用演示,后续还将推出该应用的网页版本,目前项目已托管在Netlify平台上。
但Release版本的构建体积非常大,这是我的项目访问链接:https://fbxtelecommande.netlify.app/
我已经尝试添加以下配置开启裁剪和压缩功能:
<BlazorEnableCompression>true</BlazorEnableCompression> <PublishTrimmed>true</PublishTrimmed> <TrimMode>link</TrimMode>
构建日志也明确显示裁剪功能已激活:
1>PublishTrimmed = true
但构建体积依旧偏大,构建体积截图如下:
我的项目未引入任何NuGet包,仅使用了IJSRuntime接口和NavigationManager类。
另外在Debug模式下运行时,我收到了如下日志提示:
This application was built with linking (tree shaking) disabled.
Published applications will be significantly smaller.
(翻译:当前应用构建时已禁用链接(树摇)优化,发布版本的体积会小很多)
从浏览器网络面板可以看到项目的所有程序集都会被下载,网络请求截图如下:
请问我遗漏了什么配置?该如何优化缩小Blazor WASM的发布构建体积?
解决方案
- 确认发布时使用的是Release配置
Debug模式会强制禁用裁剪、压缩逻辑,即便手动添加了相关配置也不会生效,发布前务必在构建命令中指定Release参数:dotnet publish -c Release - 升级裁剪模式为full
你当前用的link模式只会裁剪完全未被引用的程序集,.NET 6及以上版本支持full裁剪模式,会深入裁剪每个程序集内部未使用的代码,修改项目配置即可:
你的项目仅用到基础运行时接口,无需担心裁剪带来的兼容性问题。<TrimMode>full</TrimMode> - 禁用不必要的全球化配置
Blazor默认携带全量全球化ICU数据,占用体积超过2MB,如果你不需要多语言、时区相关功能,可以添加以下配置裁剪这部分内容:<!-- 关闭全量全球化数据加载 --> <BlazorWebAssemblyLoadAllGlobalizationData>false</BlazorWebAssemblyLoadAllGlobalizationData> <!-- 无需多语言可直接开启不变全球化 --> <InvariantGlobalization>true</InvariantGlobalization> <!-- 不需要时区处理可关闭时区支持 --> <BlazorEnableTimeZoneSupport>false</BlazorEnableTimeZoneSupport> - 配置Netlify正确返回压缩资源
Blazor发布时会自动生成.br(Brotli)和.gz(Gzip)格式的压缩包,你需要在Netlify的发布根目录添加_headers文件,配置请求对应资源时返回压缩格式,否则Netlify会默认返回未压缩的原始dll文件,配置示例:
也可以同时配置Gzip的回退规则,适配不支持Brotli的旧浏览器。*.dll Content-Encoding: br Content-Type: application/octet-stream *.wasm Content-Encoding: br Content-Type: application/wasm - 开启运行时重链接(.NET 7及以上版本适用)
添加以下配置可以在发布时重新链接运行时,裁剪掉未使用的运行时代码:<WasmBuildNative>true</WasmBuildNative> - 清理未使用的静态资源
检查项目wwwroot目录下的图片、CSS、JS文件,删除未引用的冗余资源,大体积图片可以转成WebP等压缩格式进一步减少体积。
内容的提问来源于stack exchange,提问作者Samih EL SAKHAWI
相关产品推荐
相关产品推荐



