Memory Leak in Injector
- 主要言語
- TypeScript
- スター
- 25k
- フォーク
- 6.8k
- 平均マージ
- 1日 8時間
- マージ済み PR(30日)
- 91
説明
I've encountered a possible memory leak while using `OverlayRef` and `Injector`.
#### Reproduction
Inside `AppComponent` there is a click event on a button. That click event will generate an array and pass that array to another component using `ComponentPortal`
The constructor and the click event from `AppComponent`:
```
// ? AppComponent constructor
constructor(private overlay: Overlay) {
this.#overlayRef = this.overlay.create({
positionStrategy: this.overlay
.position()
.global()
.centerHorizontally()
.centerVertically(),
hasBackdrop: true,
});
this.#overlayRef.backdropClick().subscribe(() => this.#overlayRef.detach());
}
onClick(){
const output = new Array(1000).fill('asfasdf');
this.#overlayRef.attach(
new ComponentPortal(
MyComponent,
null,
Injector.create({
providers: [{ provide: MY_TOKEN, useValue: output }],
})
)
);
}
```
#### Actual Behavior
It looks like each time the modal is created the data generated and injected in the component, but once the modal disappears, the data is not removed from the memory.



#### Environment
- Angular:
- "@angular/core": "~11.2.5",
- CDK/Material:
- "@angular/cdk": "^11.2.4",
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Windows10
コントリビューションガイド
調査の方向性
レポートでは AppComponent、MyComponent、OverlayRef、Injector、ComponentPortal が挙げられています。まず、繰り返しクリックを再現し、ヒープスナップショットを確認します。overlay の attach/detach ライフサイクルと Injector.create の参照を追跡し、その後、dismissal 後に injected array が解放されるかを確認して、結果を regression test または文書化した診断に記録します。
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- angular, typescript
- 領域
- frontend
- issue の種類
- バグ
- 難易度
- 4/5
- 見積もり時間
- 3〜5日
- 活発さ
- 停滞
- 明瞭さ
- 説明が足りない
- 初心者へのやさしさ
- 35/100