Some thoughts on Backbone.js

I've been working on history-lab.org, which consists of a Backbone.js application, with the server-side code using Node's Express framework.

After some fumbling around, I finally read the "Getting Started" section on backbonejs.org, and Backbone is starting to make some sense. Backbone does make it possible to use a templating system to make a template like this:

    {{#if annotationMode}}
      <div class="onoffswitch onoffswitch-checked">
    {{else}}
      <div class="onoffswitch">
    {{/if}}
  
And then manipulate that property in the render method of the Backbone.View:
    var MyView = Backbone.View.extend({
      render: function() {
        this.$el.html(this.template({
          annotationMode: false
        });
      }
    });
  

One thing I don't like about Backbone is that they encourage what they call "Bootstrapped Models". Which means, instead of loading the data with an XHR request, it's rendered by the back-end into the page's template, like this:

    <script>
      var accounts = new Backbone.Collection;
      accounts.reset(<%= @accounts.to_json %>);
      var projects = new Backbone.Collection;
      projects.reset(<%= @projects.to_json(:collaborators => true) %>);
    </script>
  

Using global variables like that introduces complexity and makes it awkward to use a module system like requirejs.