Javascript 如何优化如图所示的网络聊天页面

我想建立一个网络聊天页面，如下图所示。

我可能会选择三个朋友与之交谈，而我目前正在与一个朋友交谈。显示聊天信息的列表可以折叠和展开。列表应该被拉到刷新状态，这意味着将有许多项目可能超过200个

当我将User1切换到User2时，聊天信息列表将清除所有项目，并添加显示我和User2之间聊天信息的其他项目

现在我已经实现了这一点，但我遇到了一个问题：如果在I和User2之间有太多的项，并且如果我将User1切换到User2，它将等待几分钟

---

那么如何优化此页面呢？

这实际上取决于您的实现

我看不出你的想法有什么不好的地方，所以你正在经历如此大的延迟这一事实表明你的代码中有一些错误，可能是太多的开销，可能是操作DOM的错误方法。。。但是由于您没有提供任何代码，我们不能说

我能想到的另一件事是，您有一个非常庞大的元素列表，非常大，您的客户机需要几分钟来加载它们。如果是这种情况，您可以做的只是部分加载它们

获取最后200个元素并将它们发布到窗口中

---

然后，在scroll事件上，准备一个检索其他200个元素的函数。这样，如果客户端用户要求，您只能将元素加载到窗口中。

谢谢，先生，我分批加载元素