Partially updating a view
Partial view updating is a common feature request that many developers ask for. The requirement is to re-render part of a view without rendering the complete view. This is pretty significant, mostly when there is a complex view with lots of data and only a small portion needs to be altered. Re-rendering the complete view for every small change can be a performance hit. The solution to this, on the other hand, is quite simple. In the following example, if the address
attribute changes, then only the address part of the view's DOM will be updated, and the complete view will not be re-rendered:
... template : _.template('<p><% name %></p><p><%= address %></p>'), initialize: function() { this.listenTo(this.model, 'change:address', this.showChangedAddress); }, showChangedAddress: function () { // we are using the same main view template here though // another subtemplate for only the address part can // anyway be used here...