Angular 更改检测速度慢
Angular change detection slow
我有一个大数组，我在组件（组件 A）中使用 *ngFor 嵌套 *ngFor。
组件 B 初始化了一个 jquery 插件，它注册了一个文档 mousemove 事件处理程序，我正在使用 this.zone.runOutsideAngular 来初始化插件，我正在调用 this.ref.detectChanges()回调，因为我需要更新组件 B 内 mousemove 上的 UI。
组件 A 不是组件 B 的子组件。
渲染组件 A 后，更改检测变得非常慢。数组没有改变，我正在为组件 A 使用 ChangeDetectionStrategy.OnPush 策略，但是当我在组件 B 中触发 ref.detectChanges() 时，组件 A 上调用了 ngDoCheck，我可以看到明显的卡顿mousemove.
有没有办法告诉 angular 完全忽略组件 A 中的大量项目并允许我处理何时应该更新 UI？我认为使用 ChangeDetectionStrategy.OnPush 会给我我需要的东西，但我已经尝试从组件 A 中删除所有 @Input() 并且每当我在组件 B 中调用 this.ref.detectChanges() 它仍在触发 ngDoCheck 而且很明显这样很慢
我可以毫无问题地滚动项目列表，但是当我触发组件 B 上 mousemove 内的 detectChanges 时才导致问题。我知道我可以手动更新 DOM 但我认为这只是一种解决方法，因为它只会解决 mousemove 上的卡顿问题，而不是围绕变化检测缓慢的问题。
this.ref.detach() 将检测器从树中完全移除，这应该会停止检查。然后你仍然可以调用 detectChanges 手动完成，然后调用 reattach 使其恢复在线。
也许还可以消除鼠标移动 (rxjs debounceTime()) 的抖动，除非您真的需要跟踪每个鼠标移动？
如果您还没有优化，请将 trackBy: yourTrackByFn 添加到 ngFor(s)。
我已经查清了这个问题。
问题是在嵌套的 *ngFor 的组件 A 内部，我使用子组件来呈现每个子项，这意味着尽管我使用了 ChangeDetectionStrategy.OnPush 策略，但它仍然需要对每一项。
我现在已经将 html 从子组件直接移动到组件 A 中，这对性能产生了巨大的影响。
我有一个大数组，我在组件（组件 A）中使用 *ngFor 嵌套 *ngFor。
组件 B 初始化了一个 jquery 插件，它注册了一个文档 mousemove 事件处理程序，我正在使用 this.zone.runOutsideAngular 来初始化插件，我正在调用 this.ref.detectChanges()回调，因为我需要更新组件 B 内 mousemove 上的 UI。
组件 A 不是组件 B 的子组件。
渲染组件 A 后，更改检测变得非常慢。数组没有改变，我正在为组件 A 使用 ChangeDetectionStrategy.OnPush 策略，但是当我在组件 B 中触发 ref.detectChanges() 时，组件 A 上调用了 ngDoCheck，我可以看到明显的卡顿mousemove.
有没有办法告诉 angular 完全忽略组件 A 中的大量项目并允许我处理何时应该更新 UI？我认为使用 ChangeDetectionStrategy.OnPush 会给我我需要的东西，但我已经尝试从组件 A 中删除所有 @Input() 并且每当我在组件 B 中调用 this.ref.detectChanges() 它仍在触发 ngDoCheck 而且很明显这样很慢
我可以毫无问题地滚动项目列表，但是当我触发组件 B 上 mousemove 内的 detectChanges 时才导致问题。我知道我可以手动更新 DOM 但我认为这只是一种解决方法，因为它只会解决 mousemove 上的卡顿问题，而不是围绕变化检测缓慢的问题。
this.ref.detach() 将检测器从树中完全移除，这应该会停止检查。然后你仍然可以调用 detectChanges 手动完成，然后调用 reattach 使其恢复在线。
也许还可以消除鼠标移动 (rxjs debounceTime()) 的抖动，除非您真的需要跟踪每个鼠标移动？
如果您还没有优化，请将 trackBy: yourTrackByFn 添加到 ngFor(s)。
我已经查清了这个问题。
问题是在嵌套的 *ngFor 的组件 A 内部，我使用子组件来呈现每个子项，这意味着尽管我使用了 ChangeDetectionStrategy.OnPush 策略，但它仍然需要对每一项。
我现在已经将 html 从子组件直接移动到组件 A 中，这对性能产生了巨大的影响。