在 HTML5 Web Worker 中创建标记的 JavaScript Grid答案

【问题标题】：JavaScript Grid that create markup in HTML5 Web Worker在 HTML5 Web Worker 中创建标记的 JavaScript Grid
【发布时间】：2014-06-24 08:01:20
【问题描述】：

我正在研究基于商业智能的 Web 仪表板，我尝试了几个第三方 JavaScript 网格，即 JQGrid、ng-grid。

问题是当 Grid 尝试使用大数据对象进行渲染时，它卡住并导致浏览器崩溃。

现在我正在考虑使用 HTML5 web-worker 编写我自己的 GRID，它会在字符串中从数据对象创建 html 标记，然后传递给主对象并附加到 DOM 中。

请写出关于这种方法的建议，并命名使用这种方法的网格（如果有）..

谢谢

【问题讨论】：

你考虑过使用分页吗？如果数据真的很大，即使只使用纯 HTML，它也会冻结/崩溃浏览器。
恐怕webworkers不会解决你的问题，因为瓶颈可能是浏览器窗口中元素的绘制
是的，我已经尝试过分页，即使在分页的情况下，网格也会处理整个数据对象，然后将其分成页面。
瓶颈是有一个线程执行JavaScript和绘画，所以当它用主线程浏览器处理javascript时停止响应！
@Adnan：你实现了服务器端分页、排序和过滤吗？返回所有 200000*100 个项目并尝试全部显示给用户是没有意义的。用户应该能够根据某些标准过滤数据，对结果进行排序，然后查看结果数据的第一页，并有可能转到下一页。因此用户应该能够分析 200000*100 项数据。

【解决方案1】：

处理大量数据的性能最高的网格之一是SlickGrid。如果您要编写自己的代码，则应确保避免绘制，如 cmets 提及的，如果您确实有很多行 (100k+++)，请使用虚拟滚动。

我曾经开始编写自己的网格，我可以向您保证，让它在处理大量数据的同时保持可用并不是一件容易的事:)

【讨论】：