Cleaning up views as you leave them in Backbone

composite_view.js

CompositeView = function(options) {
  this.children = [];
  Backbone.View.apply(this, [options]);
};

_.extend(CompositeView.prototype, Backbone.View.prototype, {
  leave: function() {
    this.unbind();
    this.remove();
    _(this.children).invoke("leave");
  },

  renderChild: function(view) {
    view.render();
    this.children.push(view);
  }
});

CompositeView.extend = Backbone.View.extend;

example_controller.js

ExampleController = SwappingController.extend({
  routes: {
    "one" : "one",
    "two" : "two"
  }

  one: function() {
    this.swap(new OneView());
  },

  two: function() {
    this.swap(new TwoView());
  }
});

one_view.js

OneView = CompositeView.extend({
  render: function() {
    var childView = new ChildView();
    this.renderChild(childView);
    $(this.el).append(childView);
  }
});

swapping_controller.js

SwappingController = function(options) {
  Backbone.Controller.apply(this, [options]);
};

_.extend(SwappingController.prototype, Backbone.Controller.prototype, {
  swap: function(newView) {
    if (this.currentView && this.currentView.leave)
      this.currentView.leave();

    this.currentView = newView;
    this.currentView.render();
    $(this.el).empty().append(this.currentView.el);
  }
});

SwappingController.extend = Backbone.Controller.extend;