javascript - 在 html 中加载大型压缩 json

Question

我有一个 20MB 的 .json.gz 文件，解压后变成 280MB，我想在我的网页中获取相应的 Javascript 对象，这样我就可以做一些事情了。不幸的是，现在很明显，标准方法在达到 256MB 限制时会出现问题。

文件有两个版本，v3为20MB，v2为16MB（未压缩280MB和230MB）

对于 v2 文件，一个解决方案有效：使用 jQuery

  $.getJSON( "./data_package2.json.gz" , function( res ){    /* res contains the parsed object */ });

使用 v3 文件，它现在在解析过程中某处失败（很难调试 jQuery 的代码，所以我不能多说，错误消息也取决于 jQuery 的版本）。

具体而言，在此网页中，v2 按钮可以正常工作，但 v3 则不行。

我尝试在 Python 中加载压缩的 json 文件，它们都可以工作

    pip install compress_json
    python

        import compress_json
        D1 = compress_json.load("data_package3.json.gz")
        D1["case_data"][1]
            // it works fine ... even if it is using 800MB of RAM..

我想要一些帮助来理解 jQuery 代码中的失败之处，并最终找到一个适用于 v3 文件的 javascript zlib/JSON-parser 代码。

标签： javascripthtmljqueryjsongzip

Answer 1

我能够使用 Firefox Developer Edition 和我自己的 WASM GZip 库wasm-gzip解析您的大型测试文件：

import init, { decompressStringGzip } from "../wasm_gzip.js";

init().then(() => {
    fetch("./data_package3.json.gz")
        .then((response) => response.arrayBuffer())
        .then((buffer) => {
            let arr = new Uint8Array(buffer);
            console.log(arr);
            let decompressed = decompressStringGzip(arr);
            console.log(decompressed);
            let obj = JSON.parse(decompressed);
            console.log(obj);
        });
});

火狐开发者版

谷歌浏览器

---

• 我的基于 x64 的 PC 有 16GiB RAM。
• Google Chrome：版本 88.0.4324.104（官方版本）（64 位）
• Firefox（开发者）：86.0b4（64 位）

---

我建议使用 WebWorker 解压缩文件，因为在完成所有解析和解压缩后页面没有响应。