So we’re seeing this thing happen where we attempt to load an items template that calls our api endpoint via ember-data in the model hook to get items, this will then loop over them in an each and render a component for each one.
I have been tasked with trying to speed this up because the perceived loading is really long on some devices. We’re sure that it’s not network that’s causing this but rather rendering. So I’m trying to find the best way to load into the items page possibly with a little loading animation in place of where the items will go when the model loads them, and then after this loading of the initial render happens, then go to the store to get items from the API and render the each component loop and replace the loading animation with the rendered items.
You could think of changing the API to accept an array of items in the request or even side-loading responses, but if that is not possible, you might consider using the Ember.run loop to buffer and combine multiple changes. You could also re-inspect the design of the page to reduce thrashing when each element is rendered, e.g. perhaps causing too many changes to the DOM due to reformatting and/or reflowing stuff.
I have noticed that mobile sites “built” for Android/iOS are almost always sluggish and laggy, even from big-name AAA companies. Nothing beats a native app.
Ember data can be slow for large amounts of data. Sometimes the only thing to do is use raw ajax instead. This depends on your data workflow and can be really annoying (ember data is really good at dealing with relationships and updating data etc) but might be the only choice in some situations
