Multiple LayerLists In Web App Cause Slowness

[RichardRhone]

I have close to 50 layers in my web app. I thought, for easier access and aesthetics, i would employ multiple layerlists. However, this has made the map extremely slow. It takes upwards of 20 seconds to zoom each extent. I presume that since I have 5 layerlist with filtered layers, this essentially equates to 250 layers? How do I improve performance of the map without losing the multiple layerlists?

[KristianEkenes]

There isn't an official limit on the number of layers you can have in your map. It depends on a number of factors, including how much your browser can handle, your hardware (desktop/laptop/mobile device), network latency, how large your layers are, etc.

The larger the layer, the heavier the payload in querying for that data. That also means a lot of smaller layers can add up too. 

Can you describe the content of the 54 layers? Are you using them for reference? Editing? Do they represent completely different data for overlay purposes, or do they represent similar features? Based on your snippet above, I figure it's a transportation app. Are they all lines representing road features, or does it include a lot more than that?

[RichardRhone]

Its an island webmap so it contains roads, civic features, contours, attractions, parcels etc. The heaviest is the parcel layer, but as you rightly point out, the smaller layers add up. There is no editing but we do query some of the layers. Note that the 15 layers one contains the parcels and other necessary layers. I also utilized groupLayers in the 50+ app but there weren't  any significant improvements 

[RichardRhone · Accepted solution]

So finally i get this thing to work! The layerList with Legend was causing the slowness. Apparently, there is a bug or something that cause the slowness once you exceed a certain number of layers. I added a normal layerList widget and a legend wdget and the slowness was significantly reduced