There is no general rule, but here's a suggestion.
- Retrieve everything in one request unless the retrieval and loading takes too long.
- If it's awkward to retrieve in one request and you would save significant development time adding a second request, do it and move on.
That's a good starting point (but not always the right long term answer). If it's taking too long then it's worth worrying about breaking it up.
Check how much memory the browser uses before you retrieve this data (usually 200-1500MB on Windows or Mac OS, Chrome or Firefox). Now ask what percentage you are adding to the storage.
If your items take 1MB in serialized form. That's insignificant in a browser process that's probably already using 200MB to 1000MB.
But 1MB can be noticeable as a download, depending on network conditions.
Network Requests are often significant to user experience.
If you don't have better information then consider assuming a range of 50ms to 250ms for each request round trip (assuming server response is near instantaneous).
Where I'm sitting right now I get a 5ms round trip to the nearest
Google server, 75ms round trip to the nearest amazon.com server, 170ms
round trip to a favorite server in Europe. Some cases are routinely
worse, e.g. pacific islands.
At the low end of that range 50ms, 400 requests is 20 seconds. That's why you don't want to retrieve each individual item in a separate request.
Retrieving categories in one request and items in a second request may not be significantly different for users to notice.
One more factor to consider. With mobile users and users in rural parts of the USA, island locations, and other 'remote' locations, interruptions are common, so the comfortable round trip rate you get in a major city often degrades to a slower rate with occasional long delays and gaps.
So every additional request you add increases the opportunity for users to wait for network congestion or delays. That's a subtle point, but in some applications it makes a significant difference.
And Don't Forget The DOM
While 1MB may be insignificant to the OS and hardware, it can be enough data to really waste time in the DOM, if you are not careful with it.