Aurelia-提高视图渲染的repeat.com的性能

我有一个所谓的聊天视图，它基本上由一个

repeat.for

组成，它在所有消息上循环，并使用

呈现消息视图

问题是，一旦消息计数超过50，并且用户在聊天之间导航，它就会变得非常慢（这会触发

repeat.for

更新，因为我在VM中替换了数据集）

我觉得我在处理这样一个观点方面做错了什么。我能得到一些关于其他选择的信息吗

我尝试过UI虚拟化，但不幸的是，当前的插件不支持我需要的功能（可变高度项目、自底向上对齐）

我也做了很多关于绑定的优化，大多数都是一次性的，对数据集的更新是取消公告的。但这并没有改善情况，因为主要的瓶颈是初始负载（第一次绑定视图）

谢谢

当前方法的示例：

<li repeat.for="message of chat.messages">
  <compose  view-model.bind="getMessageViewFromMessage(message) & oneTime"
            model.bind="message & oneTime"
            containerless>
  </compose>
</li>

您应该查看aurelia ui虚拟化库。一旦你加载它，你就可以替换<代码>重复。对于使用<代码>虚拟重复。在这样的地方，对于，你将得到一个虚拟化的中继器，这将有助于改善这种情况下的PYF。

< P>我认为你根本不需要考虑使用<代码> <代码>。您需要

有什么原因吗？仔细想想，我在原始帖子中提到的

不符合我的标准，原因有两个。不过谢谢。啊，我现在明白了。我建议提交一个功能请求给那个repo，希望我们能够对它进行迭代以支持它。你能定义“相当慢”吗？当然。聊天的初始视图是50条消息（第一页）。显示它大约需要600-900毫秒，在此期间UI线程被冻结。这是在Chrome的V8 JavaScript引擎上实现的。因为很多都是纯HTML，实际上不需要很多绑定（除了音频和媒体消息），所以我想知道我需要哪些选项来加快速度。当前的做法是通过绑定到innerHTML将纯文本消息转换为静态HTML。但这对音频和媒体消息不起作用，因为它们还需要一些绑定（如
单击
委派和对
音频
对象的引用）。我使用了
，因为我有很多不同的视图（5种不同的类型）。例如文本、音频终端媒体（图像/视频）。如果我创建了五个不同的动态视图，然后将它们绑定在一起，并使用
if.bind
选择正确的视图，会更快吗？（
if.bind=“message.type==“text”
etc）嘿，德韦恩。我刚刚测试了它，我可以确认它确实更快，尽管它看起来有点让我困惑。正如我所期望的那样，
方法会更快。这真是太棒了。我认为，在您的情况下，您可能会看到许多项目被一个接一个地呈现，您会看到一些副作用，因为
附带了隐含的环境。要回答您的问题，您可以使用if.bind，或者您可以将类型传递给泛型元素，然后像switch/case语句一样在其中处理它。太棒了！我在用Aurelia和phonegap。从“撰写”移动到“if.bind”，渲染时间从6秒减少到不到2秒。谢谢哇@AlonBar，这大大缩短了渲染时间。
<li repeat.for="message of messages">
    <chat-message message.bind="message"></chat-message>
</li>