如何使用 jQuery 从 Web Worker 线程中解析 XML答案

【问题标题】：How to use jQuery to Parse XML from within a Web Worker Thread如何使用 jQuery 从 Web Worker 线程中解析 XML
【发布时间】：2013-03-03 14:03:38
【问题描述】：

略读？只需阅读粗体字即可。

朋友们好！我正在构建一个 Web 应用程序，它需要进行一些严格的 XML 处理。

我目前有一个使用jQuery来解析和操作大量XML文档的功能。这锁定浏览器的UI长达60秒，显然，相当跛脚。

我一直在研究Web Workers，因为我想在 Web Worker 线程中运行此操作以减轻浏览器的 UI。

我希望我可以使用 Web Worker 的 self.importScripts() 导入 jQuery 库，从 Web Worker 线程中解析和操作 XML。
不能做： Web Worker 会抛出错误，例如 window is not defined， 因为 jQuery 库引用了非线程安全的窗口和好友，并且因此不存在于 Web Worker 的全局命名空间中。

我在谷歌上搜索了很多，但是 很难找到有关此主题的任何最新信息。我发现了一些 hacky 变通办法和 jQuery 插件，但它们都是几年前的旧的，我一直希望我错过了针对这种相对较新的技术的更新解决方案。
是否存在（半）官方“Web Worker jQuery”？

我找到了XMLforScript，它是 jQuery 的替代品，应该在 Web Worker 中运行——但 我正在专门寻找 jQuery 解决方案，因为我不想重写我的代码。

在调用importScripts() 之前，我很想尝试创建一系列假元素来缓解 Web Worker 中的 jQuery 错误，如下所示：

window={
    document:{
        createElement:function(){
            return {
                setAttribute:function(){} } } } };
    /* ... much more fake DOM */
    importScripts('jquery.js');

但是，我意识到我必须非常深入地创建一个巨大的人工 DOM 来满足 jQuery，并且认为这可能是一条失败和浪费时间的道路，因为 jQuery 可能依赖于其中的一些对象，因为它是 XML解析（我对 jQuery 的工作原理知之甚少）。

有人有什么可爱的解决方案吗？

如果没有，我将制作一个胖胖的静态加载指示器，以警告用户恶作剧需要时间，他们必须信任并希望网络应用没有崩溃或停止工作：D

感谢您的思考。
//追逐。

【问题讨论】：

您可能想查看 jquery deferred，不确定它到底是什么，但我认为它可能适用于您正在做的事情
How to access Jquery in Html 5 Web Worker的可能重复

标签： javascript jquery performance xml-parsing web-worker

【解决方案1】：

只是为了添加一个可能的替代方案，您可能想查看Hive，或者特别是子项目 Pollen.js，它为工作人员提供了 jQuery 的许多功能（尽管显然没有直接操作 DOM）。

【讨论】：

【解决方案2】：

您应该能够使用来自 this method 的想法，它使用 Blob 让 web worker 访问原始 dom。

更新

~~工人确实可以访问DOM，正如this 玩具示例应该展示的那样~~。

上述声明是一个公然的谎言（感谢OP）。见更新二

更新二

正如 OP 在下面的 cmets 中正确指出的那样，给出的示例是作弊。如果您能够从 JQuery 中解放出来，我有一个示例，它使用功能强大的 xml for <script> 库对 xml 文档进行一些 SAX 处理。我已将示例发布到github。执行时，结果被写入console，所以打开一个。

我已上传代码here 用于演示目的。

另外，this SO question 中提供了关于 web worker 和 DOM 不可访问性的深入讨论

【讨论】：

在我看来，给定示例中的 worker 没有 DOM 访问权限。 文章引用 One downside… web workers don’t have access to the DOM，并且演示的特点是 web worker 传递序列化数据到主线程——它确实具有 DOM 访问权限，并代表 web worker 执行 DOM 操作（更新计数器）。 在此示例中， web worker 将无法访问 jQuery 或其任何方便的功能。
@ChaseMoskal：我已经更新了我的答案，其中包含一个 jsfiddle 演示的链接，该演示演示了对 DOM 的访问
我觉得你误解了这一点，尽管我真诚地感谢你的贡献尝试。在您的 Fiddle'd 示例中，Web Worker 是包含在 <script id="myWorker"> 中的代码，它不会以任何方式访问 DOM。您的网络工作者正在向主线程（拥有真正的 DOM 访问权限）发回一条消息，以便它可以代表 Worker 执行 DOM 操作。
老实说，在进一步检查中——我发现the article you linked 中给出的示例确实是糟糕的代码。我已经创建了您的 jsFiddle 的一个分支，它解释了文章技术的问题，并且还强调了 Web Worker 没有任何 DOM 访问权限（没有文档对象、没有窗口对象，甚至没有控制台对象！）。请参阅我的分叉和解释性jsFiddle。
一个有问题的Another Fork of the jsFiddle。它只为 web worker 的 script 标签添加了一个属性，这会阻止它在主线程中执行——添加type="javascript/webworker"（任何你想要的不是真实的类型值），浏览器不会执行它。创建 javascript 的主脚本会忽略此自定义类型，因为它无论如何都将类型指定为“text/javascript”。这确实解决了我对文章方法的主要问题，但是，这并没有改变网络工作者没有 DOM 访问权限的事实。