Single Page Apps fight code snippets

README.md

I'm participating in a "Single Page Apps fight" on the wroclove.rb conference and we don't want to make too much noise with the slides, so here are a few snippets that may make it easier to understand my points.

backbone.js

// This is an example from Rdio, live backbone application. This function
// is supposed to clean up the view before removing it. As you can see
// you need to do a lot of housekeeping yourself and if you forget to
// remove any event listeners, you just introduced a memory leak.

// I'm not saying that backbone is totally useless, because of that fact,
// but I would definitely not use it in any large and dynamic application.
// It's suitable for small additions for mainly static websites.
destroy: function () {
  var c = this;
  this.unbind();
  try {
    this._element.pause(),
    this._element.removeEventListener("error", this._triggerError),
    this._element.removeEventListener("ended", this._triggerEnd),
    this._element.removeEventListener("canplay", this._triggerReady),
    this._element.removeEventListener("loadedmetadata", this._onLoadedMetadata),
    _.each(b, function (a) {
      c._element.removeEventListener(a, c._bubbleProfilingEvent)
    }),
    _.each(a, function (a) {
      c._element.removeEventListener(a, c._logEvent)
    }),
    this._element = null,
    this.trigger("destroy")
  } catch (d) {}
}

hexagonal.coffee

# This is an example from the hexagonal workshop on wroclove.rb:
# https://github.com/hexagonaljs/wrocloverb-workshop-example

# The problem here is similar to the one in backbone. This code is
# supposed to do a few really simple thing and even though it needs
# a lot of housekeeping and manual views and events management.
class Gui
  constructor: ->
    @container = $("body")

  showNameForm: ->
    html = JST['templates/name_form']
    @container.append(html)
    form = @container.find("#name-form")
    form.submit (e) =>
      e.preventDefault()
      name = form.find("input[name='name']").val()
      @nameFormSubmitted(name)

  removeNameForm: ->
    @container.find("#name-form").detach()

  nameFormSubmitted: (name) ->

  showGreeting: (name) ->
    @removeNameForm()
    html = JST['templates/greeting'](name: name)
    @container.append(html)

  removeGreeting: ->
    @container.find("#greeting").detach()

  showRestartButton: ->
    button = $("<input type='button' value='restart'>")
    $("body").append(button)
    button.click (e) =>
      e.preventDefault()
      @restartClicked()

  restartClicked: ->