sticky-init-pass2

JavaScript performance comparison

Revision 2 of this test case created

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>

<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<script src="https://raw.github.com/NYTimes/backbone.stickit/master/backbone.stickit.js"></script>

<script type="text/javascript">
  _Backbone = Backbone;
  delete window.Backbone
</script>

<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<script src="https://raw.github.com/NYTimes/backbone.stickit/handlers/backbone.stickit.js"></script>

<form id="form">
  <input id="input">
  <textarea id="textarea"></textarea>
  <div id="div"></div>
  <div id="editable" contenteditable="true"></div>
  <select id="select"></select>
  <input class="boxes" type="checkbox" value="fountain">
  <input class="boxes" type="checkbox" value="evian">
  <input class="radios" type="radio" name="water" value="fountain">
        <input class="radios" type="radio" name="water" value="evian">
</form>
<script>
Benchmark.prototype.setup = function() {
    var formHTML = document.getElementById('form').innerHTML;
       
        var viewExt = {
          initialize: function(model) {
            this.model = model;
            this.$el.html(formHTML);
          },
          bindings: {
            '#input': 'input',
            '#textarea': 'textarea',
            '#div': 'div',
            '#editable': 'editable',
            '#select': {
              collection: function() {
                return [{label:'fountain',value:'fountain'}, {label:'evian',value:'evian'}];
              }
            },
            '.boxes': 'checkbox',
            '.radios': 'radio'
          },
          render: function() {
            this.stickit();
          }
        };
       
        var modelJSON = {
          input: 'fountain',
          textarea: 'fountain',
          div: 'fountain',
          editable: 'fountain',
          select: 'fountain',
          checkbox: false,
          radio: 'fountain'
        };
       
        var masterModel = new _Backbone.Model(modelJSON);
        var masterView = new (_Backbone.View.extend(viewExt))(masterModel);
       
        var handlersModel = new Backbone.Model(modelJSON);
        var handlersView = new (Backbone.View.extend(viewExt))(handlersModel);
   
};

Benchmark.prototype.teardown = function() {
    masterView.remove();
    handlersView.remove();
};
</script>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
master
masterView.render();
pending…
handlers
handlersView.render();
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment