Compatibility with loading routes

[t4t5]

Here's the problem: we want to use FastBoot to speed up initial loading time BUT we also want to keep our loading-routes so that, once Ember has loaded, transitioning between routes gives the user instant UI feedback.

What happens instead is that the correct server-rendered page starts loading at first, but is then taken over by the loading-route as soon as the JavaScript kicks in, only to go back to the data (that was initially server-rendered) again once the API calls are done.

Here's a video showing what that looks like: http://cl.ly/0C430b2d0c1e

What would be the best way of handling this?

[tomdale]

@t4t5 I think the best way to handle this case is to ensure that the model data used to do the initial, server-side render is also included in the HTML payload. FastBoot will handle this serialization for you automatically via the shoebox API (see https://github.com/ember-fastboot/fastboot#the-shoebox).

[tomdale]

@t4t5 Gonna close this issue, but please comment if you have further questions about "the shoebox."

[bakerac4]

Hey @tomdale, I was experiencing the same thing as @t4t5 so I implemented the shoebox. But after I did it I realized I still had a problem, in that my app is using store.query. We generally have admin pages that have paging and filtering. What is your recommendation for this approach?

[bakerac4]

I ended up creating an addon called ember-data-fastboot-route. It handles serialization and loading of data from the shoebox for all routes that have a model defined. Read more here. It fixed both my issues with the loading substates and using store.query for server side paging