Map Lagging on Drag and Drop Movement

KhaledAttiyat

am working on Angular 11 project having arcgis javascript version 4.17

 

when doing Drag and Drop on the map it self by the mouse, there is a kind of lagging that happens on it. the movement is not smoothly done.
note it is not something with the internet connection, 

Code:

   const properties: esri.MapProperties = {

          basemap: this.basemap

        };

this.map = new EsriMap(properties);

const map_view_properties: esri.MapViewProperties = {

          container: this.mapViewEl.nativeElement,

          center: this.homeService.mapCenter,

          zoom: this.homeService.mapZoomLevel,

          // tslint:disable-next-line: object-literal-shorthand

          map: this.map,

        };

this.view = new EsriMapView(map_view_properties);

arahman_mdmajid

@AndyGup, thank you for your response.

When I started adding code to a sample Stackblitz repo, I found that until I added all the layers to my map. The map was very smooth. When I started creating multiple layers from a collection of services in a JSON file and added them to the map, it became slow and laggy. 

  for (var layer in this.servicesArray) {
    var layerTitle = this.servicesArray[layer].name_ar;
    var layerId = this.servicesArray[layer].name_en;
    var test = new MapImageLayer({
      url: this.servicesArray[layer].serviceLayers,
      title: layerTitle,
      id: layerId,
      visible: false
    });
    map.add(test);
  }

The problem is also mentioned in this post here: https://community.esri.com/t5/arcgis-api-for-javascript-questions/reduce-lag-and-improve-performance-when-load-multi/m-p/156554. 

I cannot share an example of it since it contains sensitive layer URLs.

I also tried creating all the layers, pushing them into an array, and using the 'addMany()' methods for the array. But it also does not solve the issue.

I have also turned the layer visibility off at the time of creation.

I would appreciate it if other collaborators can also provide suggestions to resolve this issue. @ReneRubalcava @UndralBatsukh @KenBuja