Jor*_*ren 41 javascript jquery html5 web-worker
上下文: 我有一个处理和显示大量日志文件的Web应用程序.它们通常只有大约10万行,但它可以达到400万行或更多.为了能够滚动浏览该日志文件(用户启动和通过JavaScript)并过滤具有良好性能的行,我会在数据到达时为每一行创建一个DOM元素(通过ajax以JSON形式).我发现这对性能更好,然后在后端构建HTML.然后我将元素保存在一个数组中,我只显示可见的行.
对于最大100k行,这只需要几秒钟,但对于500k行(不包括下载),任何更多需要花费一分钟.我想进一步提高性能,所以我尝试使用HTML5 Web Workers.现在的问题是我无法在Web Worker中创建元素,甚至不能在DOM之外创建元素.所以我最终只在Web Workers中进行了json到HTML的转换,并将结果发送到主线程.它在那里创建并存储在一个数组中.不幸的是,这使性能恶化,现在需要至少30秒.
问题:在Web工作者中,在DOM树之外创建DOM元素是否有任何我不知道的方法?如果没有,为什么不呢?在我看来,这不会产生并发问题,因为创建元素可以并行发生而没有问题.
Jor*_*ren 16
好吧,我用@Bergi提供的信息做了一些研究,并在W3C邮件列表上找到了以下讨论:
http://w3-org.9356.n7.nabble.com/Limited-DOM-in-Web-Workers-td44284.html
摘录解释了为什么Web Worker中无法访问XML解析器或DOM解析器的原因:
您假设DOM实现代码中没有任何一个使用任何类型的非DOM对象,或者如果它实现了那些对象是完全线程安全的.事实并非如此,至少在Gecko.
在这种情况下的问题不是在多个线程上触及的DOM对象.问题是不同线程上的两个DOM对象都触及一些全局第三对象.
例如,XML解析器必须做一些Gecko只能在主线程上完成的事情(DTD加载,offhand;还有一些我之前见过但不记得的东西).
然而,还提到了一种解决方法,它使用解析器的第三方实现,其中jsdom就是一个例子.有了这个,你甚至可以访问自己独立的文档.
Ber*_*rgi 11
那么,我不知道在Web Worker中创建DOM元素之外的DOM元素吗?
没有.
为什么不?在我看来,这不会产生并发问题,因为创建元素可以并行发生而没有问题.
不是为了创造它们,你是对的.但是为了将它们附加到主要部分document- 它们需要被发送到不同的存储器(就像blob可能的那样),以便之后工作人员无法访问它们.但是,WebWorkers中绝对没有可用的文档处理.
一旦数据到达,我就为每一行创建一个DOM元素(通过ajax以JSON形式).然后我将元素保存在一个数组中,我只显示可见的行.
构建超过500k的DOM元素是一项艰巨的任务.尝试仅为可见的行创建DOM元素.为了提高性能并更快地显示前几行,您还可以将其处理分成更小的单元并在其间使用超时.请参阅如何阻止强大的Javascript循环冻结浏览器