javascript - 使用 JavaScript 的海量数据渲染性能

Question

我正在为 javascript 中的软件产品开发一个特殊的网格解决方案。数据通过服务器端的 PHP 脚本收集，并通过 JSON 数组推送到 JavaScript。在我的脚本中，我必须解析这个数组并渲染网格行。这是我的问题。如果我收到例如 4000 行，javascript 渲染速度非常快，但我认为瓶颈是浏览器......

我的问题是，是否可以只渲染可见部分？我需要滚动到其他信息，但如果它不可见，浏览器不需要渲染它。是否可以在视口之外渲染某些东西？

我需要设置宽度和位置，这只有在我将新元素添加到视口时才有可能，并且由于大量数据而这非常慢......我该如何解决这个问题？

Answer 1

这里的解决方案可能是在客户端对您的数据进行分页。这样，您可以使用 JS 对对象数组进行排序，并且一次只需将一部分数据插入到 DOM 中。

客户端分页库选项已在此处讨论。

Answer 2

DOM 更新是链中最慢的部分。如果可以的话，在内存中处理结果并一次性将其插入到 DOM 中。