I find myself in the midst of designing and developing a web store, trying to figure out the best approach to handling the loading of a substantial amount of product items. It seems that although AJAX is asynchronous, it doesn't necessarily mean parallel, so I need to get a little creative here.
Instead of downloading a large chunk of data all at once, I'm considering breaking it down into pages of around 50 to 100 items, giving the browser some time to process any internal messages.
The loader would fetch a page of data, trigger a custom event to fetch the next page. The idea is that if the browser has other messages to handle, this event will queue up behind them, allowing the browser to handle other tasks. It may result in a slight decrease in speed, but an overall smoother user experience.
Repeat this process, sprinkling in some clever engineering like a loading icon, to mask any delays and maintain a seamless user experience.
Before I jump into what sounds like an engaging coding challenge, I am wondering if there is a better way to efficiently load a large amount of data in a seamless and user-friendly manner. While I have experience as a programmer, JavaScript is relatively new to me.
Am I reinventing the wheel here? Does AJAX already have these capabilities, and I'm just not aware of it?