Blazor WebAssembly应用内存溢出：如何复用已释放内存空间？

数据老陈

2026-7-20

Blazor WebAssembly 内存复用与溢出问题解决方案

问题本质分析

Blazor WASM的内存模型确实是：WASM虚拟机向浏览器申请的内存无法主动释放给操作系统，但**.NET GC回收的内存会回到WASM堆的空闲列表，应该被后续内存分配复用**。你遇到的内存持续增长问题，核心原因是：

GC未及时触发并完成堆压缩（WASM堆需要压缩才能让空闲空间连续，方便复用）
跨JS/.NET的内存交互存在不必要的复制或未释放的引用（JSArrayBufferData就是跨域内存复制产生的冗余对象）
内存池化技术未被正确使用（比如未归还池化内存、存在额外内存复制）

具体解决方案

1. 强制触发GC并等待堆压缩

Blazor WASM默认GC是后台异步执行的，不会立即完成堆压缩。需要主动触发全量GC并等待完成，确保空闲内存被整理成连续块供复用：

private async Task DestroyBuffer()
{
    // 清空所有引用
    _bufferHolders.Clear();
    
    // 强制触发全量GC，阻塞等待完成并执行堆压缩
    GC.Collect(2, GCCollectionMode.Forced, blocking: true, compacting: true);
    GC.WaitForPendingFinalizers();
    // 再次GC确保终结器处理的对象被彻底回收
    GC.Collect(2, GCCollectionMode.Forced, blocking: true, compacting: true);
    
    _collectionCount = _bufferHolders.Count;
    await jsRuntime.InvokeVoidAsync("alert", "Buffer deleted.");
}

2. 消除JS/.NET内存交互的冗余复制

你的代码中从JS返回Uint8Array时，.NET会自动将其复制到WASM堆，产生JSArrayBufferData冗余对象。改用零复制+手动管理JS侧内存的方式：

JavaScript端修改：

// 全局维护JS侧buffer引用
const jsBuffers = new Map();
let bufferIdCounter = 0;

function CreateBuffer() {
    const length = 5 * 1024 * 1024;
    const arr = new Uint8Array(length);
    for (let i = 0; i < length; i++) {
        arr[i] = i;
    }
    const bufferId = bufferIdCounter++;
    jsBuffers.set(bufferId, arr);
    return bufferId; // 返回ID而非直接返回数组
}

function ReleaseBuffer(bufferId) {
    jsBuffers.delete(bufferId); // 释放JS侧内存
}

C#端修改：

private List<int> _jsBufferIds = new List<int>();

private async Task CreateBufferFromJs()
{
    for (int i = 0; i < _iterations; i++)
    {
        int bufferId = await jsRuntime.InvokeAsync<int>("CreateBuffer");
        _jsBufferIds.Add(bufferId);
    }
    _collectionCount = _jsBufferIds.Count;
    await jsRuntime.InvokeVoidAsync("alert", "Buffer created.");
}

private async Task DestroyBuffer()
{
    // 先释放JS侧内存
    foreach (var id in _jsBufferIds)
    {
        await jsRuntime.InvokeVoidAsync("ReleaseBuffer", id);
    }
    _jsBufferIds.Clear();
    
    // 触发GC整理WASM堆
    GC.Collect(2, GCCollectionMode.Forced, blocking: true, compacting: true);
    GC.WaitForPendingFinalizers();
    GC.Collect(2, GCCollectionMode.Forced, blocking: true, compacting: true);
    
    _collectionCount = _jsBufferIds.Count;
    await jsRuntime.InvokeVoidAsync("alert", "Buffer deleted.");
}

3. 正确使用内存池化技术

之前的内存池无效，大概率是因为你将池化内存转成了byte[]（会触发内存复制），或者未正确归还池化内存。改用IMemoryOwner<byte>直接操作：

private List<IMemoryOwner<byte>> _pooledBuffers = new List<IMemoryOwner<byte>>();

private async Task CreateBuffer()
{
    for (int i = 0; i < _iterations; i++)
    {
        // 从内存池租内存，避免直接new byte[]
        var bufferOwner = MemoryPool<byte>.Shared.Rent(_bufferLength);
        var span = bufferOwner.Memory.Span;
        // 直接在池化内存的Span上填充数据
        for (int j = 0; j < _bufferLength; j++)
        {
            span[j] = (byte)j;
        }
        _pooledBuffers.Add(bufferOwner);
    }
    _collectionCount = _pooledBuffers.Count;
    await jsRuntime.InvokeVoidAsync("alert", "Buffer created.");
}

private async Task DestroyBuffer()
{
    // 归还池化内存到内存池，供后续复用
    foreach (var buffer in _pooledBuffers)
    {
        buffer.Dispose();
    }
    _pooledBuffers.Clear();
    
    // 触发GC整理剩余内存
    GC.Collect(2, GCCollectionMode.Forced, blocking: true, compacting: true);
    GC.WaitForPendingFinalizers();
    GC.Collect(2, GCCollectionMode.Forced, blocking: true, compacting: true);
    
    _collectionCount = _pooledBuffers.Count;
    await jsRuntime.InvokeVoidAsync("alert", "Buffer deleted.");
}

关键注意事项

WASM堆的复用依赖连续的空闲内存块，必须通过GC.Collect(..., compacting: true)触发堆压缩
跨JS/.NET的内存交互尽量避免复制，优先使用引用传递+手动释放的方式
内存池的核心是复用已分配的内存块，必须确保池化内存被正确Dispose归还，而非被GC回收

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