Javascript,将非常大的表附加到 DOM 的最佳方法
我正在使用 JSON 和 PHP 返回一个包含 10,000 多条记录的非常大的表。
我遇到的问题是我使用innerHTML 将该表附加到DOM,但这有时需要15 秒或更长时间并使浏览器崩溃。有什么解决方案可以以某种方式优化这个吗?该表已预先构建到 PHP 中的一个字符串中,因此我所要做的就是附加它。
I am using JSON and PHP to return a very large table 10,000+ records.
The problem I am having is I use innerHTML to append that table to the DOM but this sometimes takes 15 seconds or more and crashes the browser. Is there any solution to optimize this somehow? The table is already pre-built into one string in PHP, so all I have to do is append it.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
最好的方法可能是使用带有分页的较小表格(我不确定是否有人真的想要滚动 10k+ 行)。
如果您坚持拥有这么大的表格,另一种方法可能是将 HTML 分解为行块(甚至与
元素分组),然后使用计时器来将它们附加到 DOM 中的表中。
The best approach would probably be to use a smaller table with pagination (I'm not sure anybody really wants to scroll through 10k+ rows).
Another approach, if you're insistent on having such a large table, might be to break up the HTML into chunks of rows (or even grouped with
<tbody>
elements) and then use a timer to append them to a table in the DOM.