Benchmark.js

by Jeremy Armstrong

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/1.0.0/benchmark.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
<ul id='cycleResults'>

</ul>
<div id="result">

</div>
<br>
<button id="btn">
Run Tests
</button>

JavaScript

function test1() {
	console.log('test1');
	return __mapDeepRecur(document.getElementById('sidebar'));
}

function test2() {
	console.log('test2');
	return __mapDeepLoop(document.getElementById('sidebar'));
}

function __mapDeepRecur(obj, iteratee, filter) {
  filter = (
    filter !== undefined &&
    filter.constructor === Function
  ) ? filter : filterFunc;
  debugger;
	
  const outp = []

  return (function recur(cur) {

    for (let [node, nodeKey] of filter(cur)) {
      result = iteratee(node, nodeKey, obj);
      if (result !== undefined) outp.push(result);
    }

    return map;
  })(obj);
}


function __mapDeepLoop(obj, iteratee, filter) {
  filter = (
    filter !== undefined &&
    filter.constructor === Function
  ) ? filter : filterFunc;

  const queue = [obj];
  const outp = [];
  var cur, result;

  while (queue.length > 0) {
    cur = queue.shift();

    let newNodes = filter(cur);
    if (newNodes.length > 0) {
      queue.push(...newNodes);

      for (let [node, nodeKey] of newNodes) {
        result = iteratee(node, nodeKey, obj);
        if (result !== undefined) outp.push(result);
      }
    }
  }

  return outp;
}

function filterFunc(curNode) { return curNode.children; }

function testIteratee(val, key, obj) { return [key, val]; }


var cycleResults = document.getElementById('cycleResults');
var result = document.getElementById('result');
var btn = document.getElementById('btn');

// BENCHMARK ====================
btn.onclick = function runTests() {

  btn.setAttribute('disable', true);
  cycleResults.innerHTML = '';
  result.textContent = 'Tests running...';

  var suite = new Benchmark.Suite;

  // add tests
  suite
    .add('test1', test1)
    .add('test2', test2)
    // add listeners
    .on('cycle', function(event) {
      var result = document.createElement('li');
      result.textContent = String(event.target);

      document.getElementById('cycleResults')
        .appendChild(result);
    })
    .on('complete', function() {
     ...