Book Image

Backbone.js Patterns and Best Practices

By : Swarnendu De
Book Image

Backbone.js Patterns and Best Practices

By: Swarnendu De

Overview of this book

Table of Contents (19 chapters)
Backbone.js Patterns and Best Practices
Credits
About the Author
Acknowledgments
About the Reviewers
www.PacktPub.com
Preface
Precompiling Templates on the Server Side
Index

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...