为什么 component/app "checked" 狠狠的没有任何反应?
Why is component/ app "checked" relentlessly without anything happening?
- 我打开Chrome
- 我开始了新的 stackblitz(版本 10)
- 添加到 app.component
ngDoCheck() { console.log('why is this checked without anything happen') }
- 我什么都不做,我什至离开了标签页。
- 为什么 changeDetection 运行 一遍又一遍? 这似乎是对计算的严重浪费。
https://stackblitz.com/edit/angular-ivy-4f8crv?file=src%2Fapp%2Fapp.component.ts
编辑:
- 情节转折发生在 chrome。不在 Firefox 上。
编辑2:
我可以确认这是一个在我的 linix 83 上很突出的“错误”...chrome build。最新的没有显示这样的问题。因此我关闭这个。
编辑: 原来是更新到最新版本的解决方案Chrome。
在您的 StackBlitz 示例中,我没有看到它被“无情地”检查。应用程序加载并 运行 两次,之后就没有了。
在真正的应用程序中,毫无疑问,它会被更频繁地检查,我已经分叉了你的 StackBlitz here 来演示它发生的原因。请注意与文本输入的交互如何经常触发它?
This 文章很好地解释了 Angular 变更检测,互联网上还有很多其他文章,但我将 post 在这里摘录一小段。
The following frequently used browser mechanisms are patched to support change detection:
all browser events (click, mouseover, keyup, etc.)
setTimeout() and setInterval()
Ajax requests
In fact, many other browser APIs are patched by Zone.js to transparently trigger Angular change detection, such as for example Websockets. Have a look at the Zone.js test specifications to see what is currently supported.
本质上,为了让您的 Angular 应用程序确保显示它应该显示的数据,它需要 运行 在它确定可能更新状态的任何事件之后进行此检查应用程序火了。
有很多方法可以减少执行此检查的次数,但通常最能为您带来最大收益的方法是 OnPush
可以配置组件的更改检测策略使用。使用此策略告诉您的组件仅在组件中输入的 reference 更改时触发更改检测,事件在我们的组件或其子组件之一中触发,或者如果我们 运行 明确更改检测。
- 我打开Chrome
- 我开始了新的 stackblitz(版本 10)
- 添加到 app.component
ngDoCheck() { console.log('why is this checked without anything happen') }
- 我什么都不做,我什至离开了标签页。
- 为什么 changeDetection 运行 一遍又一遍? 这似乎是对计算的严重浪费。
https://stackblitz.com/edit/angular-ivy-4f8crv?file=src%2Fapp%2Fapp.component.ts
编辑:
- 情节转折发生在 chrome。不在 Firefox 上。
编辑2:
我可以确认这是一个在我的 linix 83 上很突出的“错误”...chrome build。最新的没有显示这样的问题。因此我关闭这个。
编辑: 原来是更新到最新版本的解决方案Chrome。
在您的 StackBlitz 示例中,我没有看到它被“无情地”检查。应用程序加载并 运行 两次,之后就没有了。
在真正的应用程序中,毫无疑问,它会被更频繁地检查,我已经分叉了你的 StackBlitz here 来演示它发生的原因。请注意与文本输入的交互如何经常触发它?
This 文章很好地解释了 Angular 变更检测,互联网上还有很多其他文章,但我将 post 在这里摘录一小段。
The following frequently used browser mechanisms are patched to support change detection: all browser events (click, mouseover, keyup, etc.) setTimeout() and setInterval() Ajax requests In fact, many other browser APIs are patched by Zone.js to transparently trigger Angular change detection, such as for example Websockets. Have a look at the Zone.js test specifications to see what is currently supported.
本质上,为了让您的 Angular 应用程序确保显示它应该显示的数据,它需要 运行 在它确定可能更新状态的任何事件之后进行此检查应用程序火了。
有很多方法可以减少执行此检查的次数,但通常最能为您带来最大收益的方法是 OnPush
可以配置组件的更改检测策略使用。使用此策略告诉您的组件仅在组件中输入的 reference 更改时触发更改检测,事件在我们的组件或其子组件之一中触发,或者如果我们 运行 明确更改检测。