JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.rawgit.com/Heronbeluci/H3/master/dist/H3.js"></script>
<div class='results'>
  <h3>Benchmark Results</h3>
  <div id='resultExecTime'></div>
  <div id='resultBuildTime'></div>
  <div id='resultRenderTime'></div>
</div>

<div id='blockDisplay'></div>

CSS

.results{
  background-color:rgb(238,238,238);
  border:1px solid rgb(200,200,200);
  font-family:Verdana;
  font-size:12px;
  padding:8px;
}
.results h3{
  margin: 0px 0px 16px 0px;
}

JavaScript

var numOfTests = 200; // The average will be found in this amount of tests

var execStart = window.performance.now();
for (i = 0; i < numOfTests; i++) {




// Block to execute the benchmark
var bench = new H3.Block(function(block){

		block.elem('h3', {text:'Hello World'})

});
// Block to execute the benchmark




}
var execEnd = window.performance.now();
var buildStart = window.performance.now();
for (i = 0; i < numOfTests; i++){
bench.build();
}
var buildEnd = window.performance.now();
var renderStart = window.performance.now();
for (i = 0; i < numOfTests; i++){
bench.render(document.getElementById('blockDisplay'));
}
var renderEnd = window.performance.now();
document.getElementById('resultExecTime').innerHTML = "<b>Execution Time:</b> "+(execEnd - execStart)/numOfTests+"ms"
document.getElementById('resultBuildTime').innerHTML = "<b>Build Time:</b> "+(buildEnd - buildStart)/numOfTests+"ms"
document.getElementById('resultRenderTime').innerHTML = "<b>Render Time:</b> "+(renderEnd - renderStart)/numOfTests+"ms"