Blazor Server页面切换时如何释放内存？（.NET 8场景）

核心原因 #

Blazor Server中，组件实例会和用户的**电路（Circuit）**绑定，切换页面时，非活动页面的组件不会被立即销毁，而是保留在电路的组件树中。如果组件持有大量数据（比如5万条WeatherForecast），这些数据会因为组件实例的引用而无法被GC回收，导致内存持续增长。

具体解决方案 #

1. 完善IDisposable实现，彻底解除引用 #

确保FetchData组件实现IDisposable，在Dispose中清空列表并解除引用，同时清理可能存在的事件订阅：

@page "/fetchdata"
@implements IDisposable
@inject WeatherForecastService ForecastService

<h1>Weather forecast</h1>

@if (forecasts == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Date</th>
                <th>Temp. (C)</th>
                <th>Temp. (F)</th>
                <th>Summary</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var forecast in forecasts)
            {
                <tr>
                    <td>@forecast.Date</td>
                    <td>@forecast.TemperatureC</td>
                    <td>@forecast.TemperatureF</td>
                    <td>@forecast.Summary</td>
                </tr>
            }
        </tbody>
    </table>
}

@code {
    private List<WeatherForecast>? forecasts;

    protected override async Task OnInitializedAsync()
    {
        forecasts = await ForecastService.GetForecastAsync(DateOnly.FromDateTime(DateTime.Now));
    }

    public void Dispose()
    {
        // 清空列表并解除引用
        forecasts?.Clear();
        forecasts = null;
        // 若有订阅服务事件，在此取消订阅，比如：
        // ForecastService.DataUpdated -= OnDataUpdated;
    }
}

2. 改用虚拟滚动或分页加载，避免一次性加载全量数据 #

不要一次性将5万条数据加载到内存，采用Blazor内置的Virtualize组件实现虚拟滚动，只渲染当前视图可见的条目：

@page "/fetchdata"
@inject WeatherForecastService ForecastService

<h1>Weather forecast</h1>

@if (forecasts == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Date</th>
                <th>Temp. (C)</th>
                <th>Temp. (F)</th>
                <th>Summary</th>
            </tr>
        </thead>
        <tbody>
            <Virtualize Items="@forecasts" Context="forecast">
                <tr>
                    <td>@forecast.Date</td>
                    <td>@forecast.TemperatureC</td>
                    <td>@forecast.TemperatureF</td>
                    <td>@forecast.Summary</td>
                </tr>
            </Virtualize>
        </tbody>
    </table>
}

@code {
    private List<WeatherForecast>? forecasts;

    protected override async Task OnInitializedAsync()
    {
        forecasts = await ForecastService.GetForecastAsync(DateOnly.FromDateTime(DateTime.Now));
    }
}

也可以结合分页逻辑，每次仅请求当前页的100-200条数据，彻底降低内存占用。

3. 排查潜在的引用泄漏点 #

• 检查组件是否订阅了全局服务的事件但未取消订阅，导致服务持有组件引用；
• 确认无静态变量持有组件或数据的引用；
• 使用Visual Studio内存诊断工具捕获内存快照，分析未回收对象的引用链，定位泄漏根源。

4. 手动GC的正确姿势（仅调试用，生产不推荐） #

如果需要临时验证内存回收情况，可以在Dispose中配合调用GC的等待方法，但手动GC会影响性能，生产环境不建议使用：

public void Dispose()
{
    forecasts?.Clear();
    forecasts = null;
    GC.Collect();
    GC.WaitForPendingFinalizers();
}

关键提示 #

Blazor Server的组件生命周期与电路绑定，避免在组件中持有大内存对象是根本解决方案。虚拟滚动和分页不仅能解决内存问题，还能大幅提升页面渲染速度。

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