我目前进行一些异步 ajax 调用，并根据返回的数据在表中创建行。如果行数约为 400-500，页面将在 dom 创建后挂起。例如。如果我单击任何文本框或下拉菜单，它就会永远卡住。如果行数约为 100-200，然后我单击任何文本框，它仍然很慢，但至少不会卡住。
所以，我认为问题是有太多的 dom 需要创建，这会导致浏览器或页面或其他任何问题。
您有任何想法或解决方案来提高此性能吗？
最佳答案
您需要lazy load您的数据以某种方式。您是否曾在 Twitter、Facebook 和其他网站上注意到，当您滚动到页面底部时，它会开始从服务器加载更多记录？好的应用程序将开始垃圾收集已向上滚动的旧记录。
当您滚动浏览 Facebook 新闻源时，它不会同时将 2007 年以来所有 friend 的帖子加载到浏览器中。一旦 DOM 中的帖子数量达到最大数量，Facebook 将开始删除您向上滚动的最旧的帖子，为更多帖子腾出空间，并从服务器获取新帖子，以便您可以继续滚动。当您向下滚动时，您甚至可以看到浏览器滚动条向上跳跃，因为更多的帖子被添加到 DOM 中。
没有浏览器能够处理那么多数据。您必须坐下来想出更好的方法来向用户显示该数据。只有您知道用户真正想要什么体验，但无论如何您都必须减少页面上包含的元素数量。
示例:
注意浏览器滚动条到达底部时如何向上跳一点。 Twitter 会到达底部，然后加载更多数据以供滚动浏览。如果我滚动得足够远，它最终也会开始清理页面顶部的数据。
最简单的解决方案可能是通过 ajax 请求传递页码，并让服务器仅返回该数据页的结果。
关于javascript - 创建过多 DOM 后页面挂起，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30898312/