C# WebAssembly 性能优化实战：解决加载慢与内存瓶颈

为什么 C# WebAssembly 会'卡'？

传统实现往往存在未优化初始加载、数据未分页、通信非异步等问题。默认情况下，Blazor WebAssembly 可能会尝试加载所有程序集，导致浏览器内存压力过大，页面响应迟缓。

核心优化策略

通过初始代码分割、流式数据处理、异步通信优化及安全策略调整，可以显著改善体验。关键在于不要盲目使用默认配置，而是按需加载。

1. 初始代码分割

默认 Blazor 加载所有 JS 和 DLL，导致首次加载慢。生产环境必须开启动态加载。

项目配置 (.csproj)

在项目中禁用自动加载所有程序集，并启用动态加载功能。

<PropertyGroup>
  <BlazorWebAssemblyLoadAllAssemblies>false</BlazorWebAssemblyLoadAllAssemblies>
  <EnableDynamicLoading>true</EnableDynamicLoading>
</PropertyGroup>

路由配置 (App.razor)

确保路由组件支持按需加载，避免主线程阻塞。

@using Microsoft.AspNetCore.Components.WebAssembly.Hosting
<Router AppAssembly="@typeof(Program).Assembly">
    <Found Context="routeData">
        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
        <FocusOnNavigate RouteData="@routeData" Selector="h1" />
    </Found>
    <NotFound>
        <PageTitle>Not found</PageTitle>
        Sorry, there's nothing at this address.