Question

我的应用程序中存在内存泄漏问题，并希望你们可以提供帮助。在检查了问题之后，我得出的结论是它是由以下代码引起的：

我有几个html文件，我使用ngFor为数组中的每个对象创建一些html代码：

<div class="patient-box level-1" *ngFor="let bed of beds">
  more html..
</div>

在组件中，我订阅了一个不时发出新数组的observable：

updateBeds(purge: boolean) {
  this._beds.next(this.bedsData);
}

当我收到新阵列时会发生这种情况：

this.patientService.beds.subscribe(updatedBeds => {
  this.beds = updatedBeds;
  this.sortBeds(this.sortProperty);
});

我认为这里发生的事情是当我为beds数组分配新引用时，ngFor中的所有html代码都被删除，然后将为该对象创建新的html代码。来自observable的更新数组。

问题是在更新到来时删除的html代码似乎不是垃圾回收。在一段时间内拍摄多个堆快照后，我看到越来越多的独立DOM树，其中一些不断增加其保留的大小。我没有在快照中看到任何节点突出显示为黄色，但我有很多红色节点。

我不知道这是否与它有任何关系，但我特别注意到HTMLInputElement内的此代码中有很多红色HTMLImageElement和ngFor个节点： / p>

<p>
  <img draggable="false" [matTooltip]="translations?.Tooltip.O2" (click)="toggleO2(bed)" [src]="bed.additional_O2 ? medO2 : noO2">
</p>
<input class="jump-button" [matTooltip]="translations?.Tooltip.Jump2" type="image" src="../../assets/images/Jump_1-2.png" (click)="moveBed(bed, 2)">

我真的不知道该做什么。任何帮助深表感谢。谢谢！

分离的DOM树内存泄漏角

0 个答案: