3

我正在编写一个 Chrome 扩展程序，它将大量数据存储在浏览器的 localStorage 中，并在每次页面加载时对其进行解析。现在随着数据大小的增加，页面加载时间/性能开始下降。所以我想将解析委托给网络工作者。但我怀疑它是否值得。我能做的就是将我的字符串传递给这样的工人。

worker.postMessage(localStorage['myObj']);

我打算将这个字符串解析成 JSON 并将其发送回主线程，就像这样

worker.onMessage(function(myObj){
    //Then Play around with my object here.
});

但是当我在这个方法的性能方面进行搜索时，包括消息发布和监听开销，以及一些浏览器不允许在消息中发送 JSON 对象以及一些在发送时自动序列化它的事实，我怀疑这种方法是否值得.

由于我的应用程序只是一个 Chrome 扩展程序和一个 Firefox 插件，我只关心这两个浏览器。如果这种方法适用于这两种浏览器，有人可以建议我吗？

4

2 回答 2

14

当前接受的答案是完全不正确的。做你问的事情是完全可行的，下面的例子。

是否值得做是您必须在真实场景中检查真实数据的事情。将 JSON 文本发送给 worker 并让它返回解析的结果会产生开销（这很可能涉及一些幕后的序列化，尽管它可能不是 JSON），并且现代浏览器非常快速地解析 JSON。

我怀疑开销不值得，但也许在巨大的 JSON 字符串上，如果浏览器的本机序列化机制比 JSON 快得多，或者发生在主 UI 线程以外的线程上，也许它可能是。

使用 worker 解析 JSON 的示例：

// This stands in for 'worker.js':
var blob = new Blob([
  'this.onmessage = function(message) {\n' +
    'postMessage(JSON.parse(message.data));\n' +
  '};'
  ], { type: "text/javascript" });
var workerUrl = URL.createObjectURL(blob);

// Main script:
var w = new Worker(workerUrl/*"worker.js"*/);
w.onmessage = function(message) {
    display("Got response: typeof message.data: " + typeof message.data);
    display("message.data.for = " + message.data.foo);
};

display('Posting JSON \'{"foo":"bar"}\' to worker');
w.postMessage('{"foo":"bar"}');

function display(msg) {
    var p = document.createElement('p');
    p.innerHTML = String(msg);
    document.body.appendChild(p);
}
body {
  font-family: monospace;
}

结果：

将 JSON '{"foo":"bar"}' 发布到工作人员
得到响应：typeof message.data: object
message.data.for = bar
于 2015-05-26T08:23:41.797 回答
1

只有字符串，而不是对象，可以传入和传出 WebWorkers。如果您将字符串解析为 WebWorker 中的 JSON 对象，则需要将该对象字符串化，然后在将其从 worker 传递到主脚本时重新解析它。显然，这将导致 JSON 被不必要地双重解析，因此是个坏主意。

2017 更新：现在不仅允许使用字符串。请参阅一些（更新的）答案和评论以供参考。

于 2013-01-24T19:18:53.397 回答