Blazor 支持代码分割和懒加载,但方式取决于你用的是 Blazor WebAssembly 还是 Blazor Server。WebAssembly 支持真正的按需加载程序集(.dll),Server 模式则主要靠路由级组件懒加载 + 服务端资源优化,不涉及客户端 DLL 拆分。
Blazor WebAssembly:启用程序集懒加载
从 .NET 6 开始,WebAssembly 主机支持自动程序集懒加载(Lazy Assembly Loading)。关键在于配置
blazor.webassembly.js加载行为,并在
index.html中启用特性。 确保项目 SDK 是
Microsoft.NET.Sdk.BlazorWebAssembly,且目标框架 ≥ .NET 6 在
wwwroot/index.html的
<script></script>标签中添加
autostart="false",并手动调用
Blazor.start(),传入配置对象启用懒加载:
<script src="_framework/blazor.webassembly.js" autostart="false"></script><br><script><br> Blazor.start({<br> loadBootResource: function (type, name, defaultUri, integrity) {<br> if (type === 'assembly' && name.endsWith('.dll')) {<br> return fetch(`_content/${name}`, { cache: 'default' });<br> }<br> return fetch(defaultUri, { integrity: integrity, cache: 'default' });<br> }<br> });<br></script>
同时,在
Program.cs中注册懒加载服务(如需动态加载非启动时依赖的程序集): 使用
builder.Services.AddLazyAssemblyLoading();(.NET 7+ 自动启用,.NET 6 需手动加) 把非核心功能封装成独立类库(如
MyFeature.dll),发布时会自动进入
_content/目录 在组件中通过
AssemblyLoadContext.Default.LoadFromStream()或更推荐的方式 —— 使用
Lazy<t></t>+
Assembly.GetExecutingAssembly().GetReferencedAssemblies()配合按需触发加载逻辑
路由级组件懒加载(WebAssembly & Server 通用)
这是最常用、最直接的懒加载方式:让某个
@page路由对应的组件延迟初始化,直到用户导航到该路径。 不用改组件本身,只需在
App.razor的
Router组件中配置
AdditionalAssemblies和
OnNavigateAsync(可选) 更推荐做法:用
DynamicComponent+
AssemblyLoadContext手动加载特定程序集中的组件类型(适合插件化场景) 简单场景下,直接在
NavMenu.razor中用条件渲染 +
await import('./feature-component.js')(JS Interop 方式)也能实现 UI 层懒加载,但绕过 Razor 编译流程
优化包体积:拆分第三方依赖
懒加载效果好不好,取决于你有没有真正把大依赖“切出去”。比如把 Charting、PDF 导出等重型功能放到独立类库中,并确保它不被主程序集直接引用(避免 IL Linker 保留)。
在项目文件中为该类库添加<publishtrimmed>true</publishtrimmed>和
<trimmerrootassembly>YourFeature.dll</trimmerrootassembly>(防止被裁剪掉) 检查生成的
web.config或
dist/_framework/目录,确认
YourFeature.dll确实单独存在,且未被合并进
main.js用浏览器 DevTools 的 Network 面板验证:访问某页面时,是否只加载了对应 DLL,而不是所有程序集一次性拉取
Blazor Server 不支持程序集懒加载,但可以模拟
Server 模式下,所有 .NET 代码运行在服务端,客户端只收 HTML/SignalR 数据,所以“DLL 懒加载”无意义。但你可以做到逻辑上的懒初始化:
把耗时操作(如大数据查询、复杂计算)放在OnInitializedAsync中异步执行,配合
@if (isLoading) { <div>加载中...</div> }
用 RenderMode.ServerPrerendered首屏静态渲染,再切换为交互式,提升感知性能 对非首屏组件(如 Tab 页、折叠面板内容)使用
<childcontent></childcontent>+
StateHasChanged()控制渲染时机,减少初始渲染压力
基本上就这些。WebAssembly 真正支持 DLL 级懒加载,Server 更侧重服务端资源调度和前端渲染节奏控制。选对方式,才能让首屏快、后续也轻。
