ESRI javascript api 3.18

After Adding more than 5 mapimage in esri map ,zooming in chrome and mozilla takes lots of cpu. In chrome page specially hangs. If zoom level is highest then page stops working in chrome. Also in chrome,during image load page becomes somewhat unresponsive.

    var map = new esri.Map('map', {
                   //center: [6.6032, 53.1917],

                sliderStyle: "large",
                basemap:'Topo',
                 zoom:9,
                maxZoom:14,
                force3DTransforms: true,
                navigationMode: "classic"
              });

            EsriDBImageLayer= new esri.layers.MapImageLayer({  
                'id': 'usgs_basemap_image_overlay'  
            });  
            EsriDBImageLayer.setOpacity(0.7);
            map.addLayer(EsriBaseDBImageLayer);
            //dbImageList is retrieved from webservice with all
            necessary data.

            var tempImageList = dbImageList;
            for(var i=0;i<tempImageList.length;i++){
                   EsriDBImageLayer.addImage(tempImageList[i]);                                      
            }

Solution

I finally figured the solution. It was not the issue with arcgis-api but because of browser. It seems google chrome cannot handle large resolution png images files properly. So if there are more than 10 png files with more than 3k resolution then not only browser hangs but it also takes 30%+ cpu usuage. So it is better to load vector files if possible for multiple files. I had 25 + files. I hope this can be helpful to those who are facing same problem.