javascript - Chrome 中的 FileReader 内存泄漏

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

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 实例(如 this question 中所建议的)

为每个块创建新的 FileReader

在开始新块之前添加超时

在每次读取

后将 FileReader 和 ArrayBuffer 设置为 null

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

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

最佳答案

这是 Windows 上 Chrome 中的一个错误。这里报道:https://bugs.chromium.org/p/chromium/issues/detail?id=674903

关于javascript - Chrome 中的 FileReader 内存泄漏，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41181923/