应该使用ChangeDetectionStrategy.OnPush进行传送吗?

问题描述

正如标题所述:我正在做一个非常大的项目，并且在少数几个组件中使用ChangeDetectionStrategy.OnPush来避免性能下降.我想知道，插入该策略的每个组件是否好"，以防万一在需要时使用ChangeDetectionRef.detectChanges()以编程方式更新该组件?

As the title says: I'm working on a very big project and in few components I've used ChangeDetectionStrategy.OnPush to avoid bad performances. I was wondering, is it "good" to put in every component that strategy and, in case, use ChangeDetectionRef.detectChanges() to programmatically update the component when needed?

-

这是应用程序中的一个小组件:

That's a small component I have in the app:

 <my-map
    (updatedGeometry)="setUpdatedGeometry($event)"
    [startGraphEdit]="elementToEdit" [startCut]="elementToCut"
    [startCopy]="elementToCopy"
    [updateGraph]="elementToUpdate"
    [showElement]="elementToShow"
    (selectedProfile)="setProfile($event)"
    [reducedChange]="reducedChange"
    (reduceComposer)="setReducedComposer($event)"
    [labelsVisible]="labelsVisible"
    (visibleComposer)="setVisibleComposer($event)"
    [activateLayers]="activeLayers"
    (curLayers)="setCurrentLayers($event)"
    [loadExtent]="extentToLoad"
    (extent)="setExtent($event)"
    [updateZoom]="newZoom"
    (curZoom)="setCurrentZoom($event)"
    (curLon)="setCurrentLon($event)"
    (curLat)="setCurrentLat($event)"
    (poiNotesOffset)="setPoiNotesOffset($event)"
    [cancelPoiNoteCreation]="visibleDetailPanel"
    (poiNoteUpdatedPosition)="setPoiNoteUpdatedPosition($event)"
    [updatePoiNotePosition]="poiNotesElementForUpdate"
    [removePoiNoteElement]="poiNotesElementForDeletion"
    [updatePoiNotes]="updatePoiNotes"
    [projectCode]="prjCode"
    (poiNote)="poiNote($event)"
    [setPrecisionPointerValues]="precisionPointerValues"
    (precisionPointerValues)="updatePrecisionPointer($event)"
    (exploreToolArea)="setExploreToolArea($event)"
    (extentArea)="setExtentArea($event)"
    [exploreToolRadius]="exploreToolRadius"
    (newExploreToolRadius)="setExploreToolRadius($event)"
    [currEnvironment]="currEnvironment"
    (elementSelected)="onElementClick($event)"
    [setaClasses]="classes"
    [height]="mapHeight"
    [width]="mapWidth"
    [offsetX]="mapOffsetX"
    [offsetY]="mapOffsetY"
    [geometriesToHighlight]="geometriesToHighlight"
    [highlightLineElements]="lineElements"
    (poiList)="setPoiList($event)">
  </my-map>

该组件具有大量的输入和输出，并且还使用Subjects和BehaviorSubjects与其他组件进行通信.

the component has a lot of Input and Output, and also communicate with other components using Subjects and BehaviorSubjects.

推荐答案

ChangeDetectionStrategy.OnPush告诉Angular该组件仅取决于其@Inputs()，仅在以下情况下需要检查:

ChangeDetectionStrategy.OnPush tells Angular that the component only depends on its @Inputs() and needs to be checked only in the following cases:

输入参考更改.

事件起源于组件或其子元素之一.

我们明确运行更改检测.

因此，这取决于组件的内容以及您要使用该组件实现的目标.例如，如果您使用async管道进行订阅，则组件不需要ChangeDetectionStrategy.OnPush，因为async将自动执行该工作.如果您的组件很大并且使用大量数据更改，则应包含OnPush策略，因为这会提高性能，因此整个组件代码将不会在每次更改时都运行.如果您的组件很小，并且只有几个属性和方法，或者不包含任何预订或@Input，或者不执行任何经常发生的数据更改，则不需要ChangeDetectionStrategy.OnPush

So it depends from your component's content and what you are trying to achieve with it. For example if you are using async pipe for your subscriptions, your component doesn't need ChangeDetectionStrategy.OnPush, because async will do the job automatically. If your component big and uses a lot of data changes, it should contain OnPush strategy, because it will increase your performance, so your whole component code will not run on every changes. If your component small and has only a few properties and methods, or it doesn't contain any subscription or @Input's, or doesn't do any data changes that will happen often, you don't need ChangeDetectionStrategy.OnPush

这篇关于应该使用ChangeDetectionStrategy.OnPush进行传送吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！