一切都应该使用 ChangeDetectionStrategy.OnPush 吗？

Question

正如标题所说：我正在处理一个非常大的项目，并且我使用了几个组件ChangeDetectionStrategy.OnPush来避免糟糕的表现。我想知道，将每个组件放入该策略是否“好”，并且ChangeDetectionRef.detectChanges()在需要时用于以编程方式更新组件？

——

这是我在应用程序中的一个小组件：

 <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>

该组件有很多 Input 和 Output，并且还使用Subjects和与其他组件进行通信BehaviorSubjects。

Answer 1

ChangeDetectionStrategy.OnPush告诉 Angular 该组件仅依赖于它，@Inputs()并且仅在以下情况下才需要检查：

输入参考更改。

事件源自组件或其子组件之一。

我们明确地运行变更检测。

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