Chrome 中的 FileReader 内存泄漏

Question

我有一个具有文件上传功能的网页。上传以 5MB 块执行。我想在将每个块发送到服务器之前计算其哈希值。块由Blob对象表示。为了计算哈希值，我使用本机FileReader将此类 blob 读取到ArrayBuffer中。这是代码：

var reader = new FileReader();

var getHash = function (blob, callback) {
    reader.onloadend = function (e) {
        var hash = util.hash(e.target.result);
        callback(hash);
    };
    reader.readAsArrayBuffer(blob);
}

var processChunk = function (chunk) {
    if (chunk) {
        getHash(chunk, function (hash) {
            util.sendToServer(chunk, hash, function() {
                // this callback is called when chunk upload is finished
                processChunk(chunks.shift());
            });
        });
    }
}

var chunks = file.splitIntoChunks(); // gets an array of blobs
processChunk(chunks.shift());

问题：使用FileReader.readAsArrayBuffer似乎消耗了大量未释放的内存。到目前为止，我在以下浏览器上使用 5GB 文件进行了测试：

• Chrome 55.0.2883.87 m（64 位）：内存快速增加到 1-2GB，并在此范围内波动。有时它会一直上升并且浏览器选项卡崩溃。它可以使用比读取块的大小更多的内存。例如，读取 500MB 的块后，进程已经使用了 700MB 的内存。

• Firefox 50.1.0：内存使用量在 300-600MB 左右波动

我尝试过的代码调整 - 均无济于事：

• FileReader对所有块重新使用相同的实例（如本问题中所建议的）
• FileReader为每个块创建新的
• 在开始新块之前添加超时
• 每次读取后将FileReader和设为nullArrayBuffer

问题：有办法解决这个问题吗？这是 FileReader 实现中的错误还是我做错了什么？

编辑：这是一个 JSFiddle https://jsfiddle.net/andy250/pjt9udeu/

Answer 1

这是 Windows 上 Chrome 的一个错误。此处报告：https ://bugs.chromium.org/p/chromium/issues/detail?id=674903