javascript - 优化循环 ui 更新

Question

我只是想知道是什么让整个页面变慢了。

我有一个更新日期的指令，基于 Resig 的 prettyDate jquery 插件，以方便的格式显示事件发生了多长时间...指令本身围绕他们在文档页面上使用的 Angular 示例构建 here's the sample .

如果你在页面上有几个元素，它会完美地工作，但是一旦你放更多它会减慢整个页面，因为它不断更新时间，即使你在更新之间放置更长的间隔它仍然会同时更新所有元素。

你们能提出解决方案吗？是否有可能以某种方式异步更新它们，或者我知道这听起来很愚蠢，就像在不同的线程或类似的东西中一样。

人们通常如何解决这个问题，如何在不牺牲性能的情况下更新数千个元素？

.

Answer 1

你需要它每秒更新一次吗？每分钟怎么样？

与其让每个指令运行自己的计时器，不如创建一个 timerService。将此服务注入(inject)每个指令。让指令 $watch 服务属性(例如，currentTime)发生变化，并在发生变化时更新其 View 。

如果您不希望所有日期同时更新，您可以在 timerService 中创建一个计时器数组(并在更新数组的每个元素时错开)并让每个指令的链接函数选择一个随机的从要观察的数组中输入。