角度为2的DOM内存泄漏

时间:2017-07-25 20:11:58

标签: angular typescript dom

我的公司正在构建一个大规模的应用程序,我们已经创建了一个非常大的5000+线组件。也就是说,我们遇到了应用程序中存在内存泄漏的地方。我们认为这样做可以为DOM添加数千个控件。
我们将它缩小到我们将对象推入数组的位置,当垃圾收集器清理它时,我们不会从DOM中删除所有节点。所有这些说我们已经碰到了一堵砖墙,试图清理它,所以任何帮助都会受到赞赏。我还创建了一个plnkr类似于我们正在做的事情,并且比我们的应用程序在更小的范围内重现了内存泄漏。你能告诉我为什么会发生这种情况以及如何解决这个问题吗?

要查看的代码是:

html的

<div>
<div class="col-sm-1 left-column">
  <div> </div>
  <div *ngFor="let line of lines">{{line.LineName}}</div>
</div>
<div class="col-sm-11">
  <div *ngFor="let column of columns" class="col-sm-1">
    <span class=column-header>{{column?.Title}}</span>
    <div *ngFor="let line of column?.LineModels"></div>
  </div>
</div>

.TS

export class ExampleComponent implements OnInit, OnDestroy {

  constructor(private exampleService:ExampleService){
  }

  private lines:LineModel[]=[];
  private columns:ColumnModel[]=[];

  ngOnInit(){
    this.lines = this.exampleService.GetLines();
    this.columns = this.exampleService.GetColumns();
  }

  ngOnDestroy(){
    //I have tried to lines.removeAt(line.LineIndex) doesnt remove from DOM.
  }

}

Chrome Snap Shot
Chrome Snap shot

第二次出门
enter image description here

0 个答案:

没有答案