How do you handle async linked models in Backbone views

Question

When rendering a Backbone.View you generally pass it the current state of the model model.toJSON() and maybe a few extra properties. This is a synchronous task.

How do you deal with attributes on the model which require async tasks like an id of another model which needs to be fetched from the server (eg person_id)

Do you resolve and attach the person attributes in to the models attributes before sync and render or do you render the view and listen to the person fetch event to re-render that part of the view after?

NB. I am using Backbone.Marionette so am a little limited to changing the render method

Answer 1

The answer is: it depends :-)

Depending on circumstances, you either:

• fetch the model from the server, then display the view
• update the model that is already displayed

Usually if you're displaying "new" data (i.e. the whole model needs to be fetched), I would display a loading view while the data is being fetched, then display the new view (and data) when it has been fetched (see https://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/apps/contacts/show/show_controller.js)

But in other cases (e.g. the user returns to a list of "you might also like" product, such as on Amazon), you can display the data you have on hand, fetch "fresh" data, and rerender the view.

All in all, it really depends on the user experience you want to provide.