Angular2: HTML-элементы на странице отнимают больше времени

Question

Страница в моем приложении angular2 занимает больше времени для рендеринга, если пользователь постоянно выполняет действие на странице, то есть операции CRUD.

На этой странице я использовал дочерний компонент, который содержит множество выпадающих элементов.

Первоначально страница работает нормально, но постепенно визуализация представления занимает больше времени.

Пожалуйста, найдите прикрепленное изображение с элементом select, который показывает время задержки.

Ниже приведена часть кода:

родительский компонент:

import { Component, ViewChild, ViewChildren, ContentChildren, OnInit, 
OnDestroy, ChangeDetectionStrategy } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';

@Component({
selector: 'parent',
templateUrl: 'app/templates/parent.component.html',
// changeDetection: ChangeDetectionStrategy.OnPush
})

export class ParentComponent implements OnInit, OnDestroy {

}

дочерний компонент:

import { Component, OnInit, Input, Output, OnChanges, EventEmitter,SimpleChange} from '@angular/core';
import { Router } from '@angular/router';

@Component({
selector: 'child',
templateUrl: 'app/templates/child.component.html'
})

export class ChildComponent implements OnInit, OnDestroy {

   ngOnChanges(changes: { [propName: string]: SimpleChange }) {
    if (changes['canBindDropdown'].currentValue) {
       this.BindFilterDropDown();
    }
   }
}

У меня есть вход с именем canBindDropdown в моем дочернем компоненте, при изменениях этого из родительского компонента вызывается функция BindFilterDropDown, которая связывает все выпадающие списки.

Я провел некоторые исследования, и большинство из них предложили изменить стратегию ChangeDetection на OnPush. Но это создает плохие последствия, такие как события, которые не будут уволены

Любая помощь будет очень полезна!