ngx-leaflet-markercluster freezes after changing layer

Question

Good afternoon! Browser page freezes after I try to draw new markercluster after I change layer. What could be the reason? What am I doing wrong? Task: by pressing the button, the tayer of the map should be selected, and then a group of markers should be drawn on it.

export class MapPanelComponent implements OnInit
{
    map:any;
    layer:any;
    markerClusterGroup: L.MarkerClusterGroup;
    markerClusterOptions: L.MarkerClusterGroupOptions;
    markerClusterData: Array<any> = [];
    layerImage= L.imageOverlay('../../../../../assets/maps/image.jpg',[[-550,-612],[550,612]],{
          attribution: 'Image'
    });
    layerWorld = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'Map World' });
    constructor(){}

    generateLat() { return Math.random() * 360 - 180; }
    generateLon() { return Math.random() * 180 - 90; }

    markerClusterReady(group: L.MarkerClusterGroup) 
    {
       this.markerClusterGroup = group;
    }
    getString(val:any):string
    {
        if(typeof val === 'string') return val.toString();
        return '';
    }
    getArray(val:any):[]
    {
        if(typeof val === 'object') return val;
        return [];
    }
    onMapReady(map: L.Map) {
        this.map = map;
    }
    ngOnInit(): void 
    { 
        this.layer = this.layerWorld;
    }
    refreshData(): void 
    {
        this.markerClusterData = this.generateData(2);
    }
    generateData(count: number): L.Marker[] 
    {
        const data: L.Marker[] = [];
        for (let i = 0; i < count; i++) 
        {
            data.push(L.marker([ this.generateLat(), this.generateLon() ]));
        }
        return data;
    }
    select(object:any)
    {
        this.options.zoom = 10;
        this.layer = layerImage;
        this.refreshData();
    }

    title = NAME_APP;
    options = {
        zoom: 5,
        center: L.latLng(46.879966, -121.726909)
    };
}