Memory leak using ngOnChanges hook

Question

I am facing an issue with a memory leak when using the ngOnChanges hook to access the changes to an input property in my child component. I am sending a large amount of data (an array with 27000 items) from my parent component and the data within the array is changing at a frequency of at least 30hz. I think that the garbage collector is not removing the references of the previousValue in the changes: SimpleChanges object at the same frequency as mentioned above. Is there a manual way I can dispose of the data from the object or is there a more efficient way of accessing the changes on the input property other than the hook? Please correct me if that is not the root cause of the memory leak? I can share my code if required.

Answer 1

I was able to fix the issue by disposing of the old array references immeaditaley after I had processed the old data

Answer 2

There is no way of knowing from the details of your question if ngOnChanges is causing a memory leak - if it's a recent version of Angular I would imagine it's pretty unlikely

As a way of ruling it out, you could use property accessors with @Input instead of ngOnChanges

private _data: any[];

@Input() set data(value: any[]) {
  this._data = value;
  this.runUpdates();
}
get data(): any[] {
  // other logic
  return this._data;
}

When using the above approach, make sure to pass in a new array via the input binding i.e. the setter won't be triggered via array mutations