What's the appropriate granularity for Backbone.js Views?

Question

I\'m adopting Backbone.js to render a small corner of an existing large web app. If this goes well, I can see Backbone.js growing to encompass the whole of the app, lending some

Answer 1

In general, the granularity of your views will depend on finding a balance between the complexity of the particular piece of UI, and over-fragmentation of views into little pieces. I probably would not use a view for something as small as a button (a CSS class is all you really need for that).

In your particular case, I'd probably have a view for the calendar widget -- so it can be easily reused in other places in the app -- and a view for the entire Devotions tab. The rest can be done through event binding.

Regarding model updates and re-rendering, the whole idea with Backbone is to separate that concern from the views. Models emit "change" events when their attributes change, and whatever views happen to be on the page at the time, and are displaying that particular model's data, will be notified of the change, and can update themselves.

Answer 2

There is no definitive answer to your question. You can have a look at the granularity of sproutcore for exemples.

You can also watch http://vimeo.com/17186379 where Yehuda Katz illustrate the difficulties of updating different pieces of the page.

One way of looking at it would be to check which part should be refreshed with different model change/events and try to minimize the re rendering.

Sorry no good answers as you pointed out ;)