Philosophy, Usage & Convention

In notebook:
FrontEndMasters BackboneJS
Created at:
JavaScript jQuery libraries pattern Fundamentals


"There's more than one way to do it" – Backbone documentation
There are many good ways to do things. Many patterns are left to the implementors to figure out
Shows a typical jQuery-based example, where selectors, event handlers, ajax calls, ajax callbacks, error handling are all on "one line" and tied to the DOM.

We'll look at how to do it with Backbone.

(unrelated note: to request json in an ajax call use ​dataType​ property)

What's wrong with it?

  • Data "disappears" once the ajax call is complete (it only lives in the DOM)
  • Application state is tied to the DOM
  • Re-rendering efficiently takes a lot of code – and its not pretty...
  • Hard to test without mocking AJAX
  • Blows up very quickly
And some further issues:
  • What about file organisations?
  • Multiple dynamic elements per page?
  • Tied heavily to selectors – changes to the DOM will break your code
  • Selective re-rendering is even more code, and heavily reliant on data structure

Backbone helps fixing these issues