AngularJS 中的数据绑定是如何工作的?
AngularJS 会记住该值并将其与之前的值进行比较。这是基本的脏检查。如果值发生变化,则触发 change 事件。
当您从非 AngularJS 世界过渡到 AngularJS 世界时,该$apply()方法调用$digest(). 摘要只是简单的旧脏检查。它适用于所有浏览器并且完全可以预测。
$apply()
$digest()
对比脏检查(AngularJS)和更改监听器(KnockoutJS和Backbone.js):虽然脏检查看起来很简单,甚至效率低下(我稍后会解决这个问题),但事实证明它在语义上一直是正确的,而更改侦听器有很多奇怪的极端情况,需要依赖跟踪之类的东西来使其在语义上更正确。KnockoutJS 依赖跟踪是 AngularJS 所没有的一个聪明的功能。
所以看起来我们很慢,因为脏检查效率低下。这是我们需要查看实数的地方,而不仅仅是理论上的论据,但首先让我们定义一些约束。
人类是:
所以真正的问题是:你可以在 50 毫秒内在浏览器上进行多少次比较?这是一个很难回答的问题,因为有许多因素在起作用,但这里有一个测试用例:http: //jsperf.com/angularjs-digest/6,它创建了 10,000 个观察者。在现代浏览器上,这需要不到 6 毫秒。在Internet Explorer 8上大约需要 40 毫秒。如您所见,即使在如今速度较慢的浏览器上,这也不是问题。有一个警告:比较需要简单以适应时间限制......不幸的是,将慢速比较添加到 AngularJS 中太容易了,因此当您不知道自己在做什么时,很容易构建慢速应用程序是做。但是我们希望通过提供一个检测模块来得到答案,它会告诉你哪些是慢速比较。
事实证明,视频游戏和 GPU 使用脏检查方法,特别是因为它是一致的。只要他们超过显示器刷新率(通常为 50-60 Hz,或每 16.6-20 ms),任何超过此的性能都是浪费,所以你最好画更多的东西,而不是提高 FPS。