Use an Ember Service to Load Paginated Global Data in the Background

I have some data that I want to load as soon as my Ember application boots, but it isn’t a requirement for the data to load before I render the first route. The data is paginated on the server, and I’d like to load those pages of data in the background while the user is interacting with the application so that as much of the data as possible is loaded before it is needed.

So, I created a service, and it resolves with all of the models once they’ve been loaded in pages from the server.

app/services/states.js

The service is initialized in a route to start the background data loading.

app/routes/authenticated.js

Then, I can use the states service in a controller and know that when it resolves I’ll have all of the states without holding up the rendering of the application unnecessarily.

Here’s part of a controller that uses that service from the application.

app/controllers/state-matches.js