如何在Blazor WebAssembly中实现单页面按需加载？

当然可以，Blazor WebAssembly 完全支持按需加载程序集（又称延迟加载），能有效避免一次性下载完整应用的问题，下面是几种实用的实现方式：

1. 基于路由的自动延迟加载 #

这是官方推荐的主流方案，核心思路是把不同页面的组件拆分到独立的类库（RCL）中，只有当用户访问对应路由时，才会触发该类库程序集的下载。

具体操作步骤：

• 新建一个 Razor 类库项目，将需要延迟加载的页面组件放到这个项目里
• 在主项目的 Program.cs 中注册延迟加载的程序集：

  builder.Services.AddRazorComponents()
      .AddInteractiveWebAssemblyComponents()
      .AddAdditionalAssemblies(typeof(DelayedPageComponent).Assembly);
  

• 在 App.razor 的 Router 组件中配置动态加载逻辑，或者直接用 LazyAssemblyLoader 配合路由导航事件触发加载：

  <Router AppAssembly="@typeof(App).Assembly"
          AdditionalAssemblies="@lazyLoadedAssemblies">
      <!-- 路由内容模板 -->
  </Router>
  
  @code {
      private List<Assembly> lazyLoadedAssemblies = new();
  
      protected override async Task OnInitializedAsync()
      {
          // 可以结合导航事件，在用户访问特定路由时加载对应程序集
          var loader = new LazyAssemblyLoader();
          var targetAssembly = await loader.LoadAssembliesAsync(new[] { "YourDelayedAssembly.dll" });
          lazyLoadedAssemblies.AddRange(targetAssembly);
      }
  }
  

2. 手动触发的延迟加载 #

如果需要在用户主动操作（比如点击按钮、展开功能模块）时才加载程序集，可以用手动触发的方式：

private async Task LoadFeatureModule()
{
    var loader = new LazyAssemblyLoader();
    var loadedAssemblies = await loader.LoadAssembliesAsync(new[] { "FeatureModule.dll" });
    // 加载完成后即可直接使用该程序集中的组件
}

3. 优化加载体验的细节 #

• 在程序集加载过程中，添加加载动画或提示文本，让用户感知到加载状态
• 配合 Linker 配置裁剪未使用的代码，进一步缩小单个延迟加载程序集的体积
• 浏览器会自动缓存已下载的程序集，后续访问无需重复下载，可有效提升二次访问速度

注意事项 #

• 拆分程序集时要合理划分模块，避免过度拆分导致频繁下载小文件，反而影响体验
• 确保延迟加载的程序集依赖项能正确加载，必要时可将关联依赖打包到同一延迟加载单元中

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