javascript - 使用动态生成的数据数组进行 ng-repeat 的性能

Question

假设我有一个对象数组，每个对象都有一个唯一的 ID 和一个文本属性。

现在，假设我有一个像这样的 ng-repeat:

Controller

$scope.data = my_arr;

查看

<div ng-repeat="for elem in data track by elem.id">
    {{ elem.text }}
</div>

关于 track by 的特别说明。

如果我将一个全新的数组分配给 data 变量 ($scope.data = new_arr;) 会发生什么，如果这个新数组的内容:

• 与上一个完全相同
• 它包含 1 个新元素
• 它包含除 1 之外的所有元素

AngularJS 是否足够聪明:

• 不重新渲染所有 div 元素
• 仅将新的 div 元素追加/插入到 DOM
• 仅隐藏/删除新数组中未包含的 div

Answer 1

由于您正在使用 track by elem.id，Angular 将重用 DOM 元素。它只会向文档树添加或删除一个元素。每the docs :

Should you reload your data later, ngRepeat will not have to rebuild the DOM elements for items it has already rendered, even if the JavaScript objects in the collection have been substituted for new ones.