@danielkalen/simplybind/comparison/dist/Native@(manual)/test.js

Magically simple, framework-less one-way/two-way data binding for frontend/backend in ~5kb.

var genObj;

genObj = function(defaultValue) {
  var generatedObject, getterSetter;
  getterSetter = {
    'prop': {
      get: function() {
        return defaultValue;
      },
      set: function(newValue) {
        return defaultValue = newValue;
      }
    }
  };
  generatedObject = Object.create(null, getterSetter);
  generatedObject.value = 'value';
  return generatedObject;
};

new TestSuite({
  'title': 'Object Update',
  'subtitle': 'Update the value of an object property 10,000 times',
  'measureMethod': 'sync',
  'nonSharedTest': true,
  'warmUps': 10000,
  'timesToRun': 10000,
  'setupFn': function(container$) {
    var currentValue;
    this.objA = genObj('value');
    this.objB = genObj('value');
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
  },
  'teardownFn': function(container$) {
    delete this.objA;
    delete this.objB;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue;
    newValue = this.getNewValue();
    this.objA.prop = newValue;
    return this.objB.prop = newValue;
  }
});

new TestSuite({
  'title': 'Input Update',
  'subtitle': 'Update the value of an input field 10,000 times',
  'measureMethod': 'sync',
  'timesToRun': 10000,
  'setupFn': function(container$) {
    var currentValue;
    this.obj = genObj('value');
    this.input = $('<input type="text">')[0];
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    container$.append(this.input);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.obj;
    delete this.input;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue;
    newValue = this.getNewValue();
    this.obj.prop = newValue;
    return this.input.value = newValue;
  }
});

new TestSuite({
  'title': 'Input x100 Update',
  'subtitle': 'Update the value of 100 input fields 1,000 times',
  'measureMethod': 'sync',
  'warmUps': 100,
  'timesToRun': 1000,
  'setupFn': function(container$) {
    var currentValue, i, inputs;
    currentValue = 0;
    this.obj = genObj('value');
    inputs = (function() {
      var j, results;
      results = [];
      for (i = j = 1; j <= 100; i = ++j) {
        results.push('<input type="text">');
      }
      return results;
    })();
    this.inputs$ = $(inputs.join(''));
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    container$.append(this.inputs$);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.obj;
    delete this.inputs$;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var input, j, len, newValue, ref, results;
    newValue = this.getNewValue();
    this.obj.prop = newValue;
    ref = this.inputs$;
    results = [];
    for (j = 0, len = ref.length; j < len; j++) {
      input = ref[j];
      results.push(input.value = newValue);
    }
    return results;
  }
});

new TestSuite({
  'title': 'Input Transform',
  'subtitle': 'Update the value of an input field 10,000 times and apply a transform function',
  'measureMethod': 'sync',
  'timesToRun': 10000,
  'setupFn': function(container$) {
    var currentValue;
    this.obj = genObj('value');
    this.input = $('<input type="text">')[0];
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    this.transform = function(value) {
      return value.toUpperCase();
    };
    container$.append(this.input);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.input;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue;
    newValue = this.transform(this.getNewValue());
    this.obj.prop = newValue;
    return this.input.value = newValue;
  }
});

new TestSuite({
  'title': 'Div HTML Update',
  'subtitle': 'Update the content of a div 10,000 times',
  'measureMethod': 'sync',
  'timesToRun': 10000,
  'setupFn': function(container$) {
    var currentValue;
    this.obj = genObj('value');
    this.div = $('<div />')[0];
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    container$.append(this.div);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.obj;
    delete this.div;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue;
    newValue = this.getNewValue();
    this.obj.prop = newValue;
    return this.div.innerHTML = newValue;
  }
});

new TestSuite({
  'title': 'Div HTML Same Update',
  'subtitle': 'Update the content of a div with the same value 10,000 times',
  'measureMethod': 'sync',
  'warmUps': 10000,
  'timesToRun': 10000,
  'setupFn': function(container$) {
    this.obj = genObj('value');
    this.div = $('<div />')[0];
    container$.append(this.div);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.obj;
    delete this.div;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue;
    newValue = 'value';
    this.obj.prop = newValue;
    return this.div.innerHTML = newValue;
  }
});

new TestSuite({
  'title': 'Div HTML Placeholder',
  'subtitle': 'Update a placeholder in the content of a div 10,000 times',
  'measureMethod': 'sync',
  'timesToRun': 10000,
  'setupFn': function(container$) {
    var currentValue;
    this.obj = genObj('value');
    this.valueOriginal = 'Content {{value}} works.';
    this.div = $("<div>" + this.valueOriginal + "</div>")[0];
    this.regEx = /\{\{value\}\}/g;
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    container$.append(this.div);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.div;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue;
    newValue = this.getNewValue();
    this.obj.prop = newValue;
    return this.div.innerHTML = this.valueOriginal.replace(this.regEx, function() {
      return newValue;
    });
  }
});

new TestSuite({
  'title': 'Div HTML 250 Placeholders',
  'subtitle': 'Update 250 placeholders in the content of a div 1,000 times',
  'measureMethod': 'sync',
  'warmUps': 100,
  'timesToRun': 1000,
  'setupFn': function(container$) {
    var currentValue;
    this.obj = genObj('value');
    this.valueOriginal = '{{value}} '.repeat(250);
    this.div = $("<div>" + this.valueOriginal + "</div>")[0];
    this.regEx = /\{\{value\}\}/g;
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    container$.append(this.div);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.div;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue;
    newValue = this.getNewValue();
    this.obj.prop = newValue;
    return this.div.innerHTML = this.valueOriginal.replace(this.regEx, function() {
      return newValue;
    });
  }
});

new TestSuite({
  'title': 'Div Text Update',
  'subtitle': 'Update the textContent of a div 10,000 times',
  'measureMethod': 'sync',
  'timesToRun': 10000,
  'setupFn': function(container$) {
    var currentValue;
    this.obj = genObj('value');
    this.div = $('<div />')[0];
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    container$.append(this.div);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.div;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue;
    newValue = this.getNewValue();
    this.obj.prop = newValue;
    return this.div.textContent = newValue;
  }
});

new TestSuite({
  'title': 'Div Text Placeholder',
  'subtitle': 'Update a placeholder in the textContent of a div 10,000 times',
  'measureMethod': 'sync',
  'timesToRun': 10000,
  'setupFn': function(container$) {
    var currentValue;
    this.obj = genObj('value');
    this.div = $('<div />')[0];
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    container$.append(this.div);
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.div;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var newValue, placeholder;
    placeholder = 'Content {{value}} works.';
    newValue = this.getNewValue();
    this.obj.prop = newValue;
    return this.div.textContent = placeholder.replace('{{value}}', newValue);
  }
});

new TestSuite({
  'title': 'Create 1k DOM Els',
  'subtitle': 'Create 1000 elements from array & insert into a div',
  'measureMethod': 'sync',
  'warmUps': 10,
  'timesToRun': 10,
  'setupFn': function(container$) {
    this.obj = {
      'divs': []
    };
    this.container$ = container$;
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.obj.divs;
    return delete this.obj;
  },
  'testFn': function() {
    var i, j, len, newInnerHTML, ref, value;
    this.obj.divs = (function() {
      var j, results;
      results = [];
      for (i = j = 1; j <= 1000; i = ++j) {
        results.push(i);
      }
      return results;
    })();
    newInnerHTML = '';
    ref = this.obj.divs;
    for (j = 0, len = ref.length; j < len; j++) {
      value = ref[j];
      newInnerHTML += "<div>" + value + "</div>";
    }
    return this.container$[0].innerHTML = newInnerHTML;
  }
});

new TestSuite({
  'title': 'Update 1k DOM Els',
  'subtitle': 'Update 1000 existing elements 100 times',
  'measureMethod': 'sync',
  'timesToRun': 100,
  'setupFn': function(container$) {
    var currentValue, divs, i, j, len, newInnerHTML, value;
    this.obj = genObj('value');
    this.container = container$[0];
    currentValue = 0;
    this.getNewValue = function() {
      return "value" + (currentValue++);
    };
    divs = (function() {
      var j, results;
      results = [];
      for (i = j = 1; j <= 1000; i = ++j) {
        results.push(i);
      }
      return results;
    })();
    newInnerHTML = '';
    for (j = 0, len = divs.length; j < len; j++) {
      value = divs[j];
      newInnerHTML += "<div>" + value + "</div>";
    }
    return container$[0].innerHTML = newInnerHTML;
  },
  'teardownFn': function(container$) {
    container$.empty();
    delete this.obj.divs;
    delete this.obj;
    return delete this.getNewValue;
  },
  'testFn': function() {
    var div, j, len, newValue, ref, results;
    newValue = this.getNewValue();
    this.obj.prop = newValue;
    ref = this.container.children;
    results = [];
    for (j = 0, len = ref.length; j < len; j++) {
      div = ref[j];
      results.push(div.textContent = newValue);
    }
    return results;
  }
});