router.js

// The home page needs to load a lot of data for a feed of events.
// This would block initial rendering of the application, so what
// we do is make a pathless child route called feed that loads the
// data.

// Since our home route doesn't load data anymore it renders
// immediately. It has an {{outlet}}, and while 'home.feed' is
// fetching data 'home.loading' will be rendered into the
// outlet. Once feed's model hook fulfills the feed template
// is rendered to the outlet.

// Our loading template is a skeleton ui of the feed.

// This makes Ember's router give the apperence async
// rendering while still being able to use all the goodies
// in the router.

this.route('home', { path: '/' }, function() {
  this.route('feed', { path: ''});
});