加速灰烬渲染 - 灰烬计算属性列表

Question

在更大数据集上更改计算属性的依赖关系时，我一直试图找到一种加速渲染的方法。

此处示例：http://emberjs.jsbin.com/IKicoBa/1/edit

你会注意到有约。启用和禁用行时延迟3-5秒。我已经测试了过滤mixin和名称排序，它们似乎几乎是瞬间计算出来的。这似乎是渲染DOM更改的问题。

任何见解都将受到赞赏。

Answer 1

我认为您不需要在数据中循环两次，我的意思是，您已经在此代码中使用了if：

{{#each obj in sortedObservations itemController='observationContainer'}}
<div class='observation-container row'>
    {{#if isActive}}
        <div {{action 'disable'}} class='toggleActive'>Deactivate</div>
    {{else}}
        <div {{action 'enable'}} class='toggleActive'>Activate</div>
    {{/if}}
    <div class='observation-participant-name'>{{obj.participant.first_name}}</div>

所以，如果你已经有一个if来区分活动和非活动的，为什么要循环两次？所以，只需更改循环以循环遍历所有已排序的数据（我认为是sortedObservations），就是这样，您还可以删除活动/非活动Observations属性，这也将提高性能。