Question

我应该在Javascipt中解析一个非常大的JSON数组。它看起来像：

mydata = [
    {'a':5, 'b':7, ... },
    {'a':2, 'b':3, ... },
    .
    .
    .
    ]

现在的问题是，如果我将整个对象传递给我的解析函数parseJSON()，那么当然它可以工作，但是它会阻止选项卡的进程30-40秒（如果数组有160000个对象））。

在从服务器请求此JSON并解析它的整个过程中，我正在向用户显示“加载”gif。当然，在我调用parse函数之后，gif也会冻结，导致糟糕的用户体验。我想这次没有办法解决，有没有办法以某种方式（至少）保持加载的GIF不被冻结？

类似于每隔几毫秒在我的JSON块上调用parseJSON（）？虽然在javascript中是一个菜鸟，但我无法实现它。

非常感谢，如果你能帮助我，我真的很感激。

Answer 1

您可能需要查看this link。这是关于多线程的。

基本上：

var url = 'http://bigcontentprovider.com/hugejsonfile';

var f = '(function() {
            send = function(e) { 
                postMessage(e); 
                self.close();
            };
            importScripts("' + url + '?format=json&callback=send");
         })();';

var _blob = new Blob([f], { type: 'text/javascript' });

_worker = new Worker(window.URL.createObjectURL(_blob));
_worker.onmessage = function(e) { 
    //Do what you want with your JSON 
}
_worker.postMessage();

说实话，我自己没试过......

关于可移植性的编辑：Sebastien D.在a link to mdn发表评论。我刚刚在兼容性部分id中添加了一个引用。

Answer 2

我从未遇到过30-40秒的完整页面锁定，我印象非常深刻！将数据重组为更小或将其拆分为服务器端的许多文件是真正的答案。你真的需要数据的每个小字节吗？

或者，如果您无法更改文件@ Cyrill_DD，则工作线程的答案将能够为您解析数据并将其发送到您的主JS。尽管如此，这并不是一个完美的解决方案。在两个线程之间传递数据需要序列化和重新解释信息，因此当数据在线程之间传递时，您可能会发现显着减慢，如果您尝试一次传递所有数据，则会再次返回到方形。在您的工作线程中构建查询系统，以便在您需要时使用数据请求数据块并使用消息回调，这将防止在主线程上解析速度变慢，并允许您完成对数据的访问，而无需将其全部加载到主上下文中。

我应该补充一点，工作线程相对较新，主浏览器支持很好，但移动很糟糕......只是一个抬头！

在Javascript中解析大型JSON数组

2 个答案: