Angular JS ng-repeat消耗更多的浏览器内存

Question

我有以下代码

<table>
 <thead><td>Id</td><td>Name</td><td>Ratings</td></thead>
 <tbody>
   <tr ng-repeat="user in users">
    <td>{{user.id}}</td>
    <td>{{user.name}}</td>
    <td><div ng-repeat="item in items">{{item.rating}}</div></td>
   </tr>
 </tbody>
</table>

users是一个只有id和name的用户对象数组.数组中的用户对象数 - 150

items是一个只有id和rating的项目对象数组.数组中的项目对象数 - 150

当我在浏览器中渲染它时,当我尝试在我的chrome中进行分析时,它需要大约250MB的堆内存 - v23.0.1271.95.

我正在使用AngularJS v1.0.3.

有角度的问题还是我在这里做错了什么？

这是JS小提琴

http://jsfiddle.net/JSWorld/WqSGR/5/

Answer 1

好吧,这不是ng-repeat本身.我认为您正在使用{{item.rating}}添加绑定.

所有这些绑定都在范围内注册观察:

• 150*2 = 300(2个用户的信息)
• 150*150 = 22500(评级信息)
• 共有22800个手表功能+ 22800个dom元素.

这会将内存推向250MB的可想象值

来自angularjs中的数据绑定

您无法在单个页面上向人类显示超过2000条信息.除此之外的任何东西都是非常糟糕的UI,人类无论如何都无法处理它.