ng-repeat 需要很多时间来渲染 html？答案

【问题标题】：ng-repeat takes a lot time to render html?ng-repeat 需要很多时间来渲染 html？
【发布时间】：2014-05-21 17:42:21
【问题描述】：

repeat 有大约 4k + 的数据。渲染html需要很长时间。

我在 3 秒内从后端获取数据，而 ng-repeat 大约需要 9 秒来呈现所有 4k + 记录。

有什么方法可以加快 ng-repeat 的性能？

感谢您的帮助？

【问题讨论】：

如果您提供呈现页面的代码会有所帮助，如果不知道代码中发生了什么就很难猜到。
是的，清理你的模型，让它们只有你要显示的数据。不要只是获取你的记录并显示它们，过滤与视图相关的数据。分页数据也有帮助.当您绝对必须在同一页面中显示 4000 行数据时，我想不出任何用例。
如果我添加 limitTo 过滤器会怎样。在这种情况下，它应该等待所有 400 条记录呈现还是我传递给 limitTo 过滤器的值？

【解决方案1】：

如果您有重新创建但可能重复的元素，您可能需要查看 Angular 1.2 中添加的 track by 功能。它将显着加快ngRepeat，尤其是在移动设备上。

此外，您还可以利用limitTo，它可以调整渲染元素的数量。可以在此处找到有关此方法的详细说明：

【讨论】：

【解决方案2】：

您还可以尝试延迟加载列表底部的记录或软分页，以延迟一次渲染所有 4k 记录。虽然它更像是一种 UX 处理。

我用它对包含 20k 条记录的表进行软分页，

<div ng-repeat="item in list | limitTo:n></div>
<a href="javascript:void(0)" ng-click="n=n+100">more</a>

【讨论】：

我已经这样做了，但我不确定为什么需要 9 秒。有什么方法可以检查它需要时间吗？
您可以使用Batarang 来监控它。如果您在 ng-bindgins 中使用了函数或过滤器，请尝试记住它们。这应该有助于减少运行时表达式评估并为您提供一些速度。