JSFiddle - React, Tailwind, and code Playground

by volovikov

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/platform/1.3.1/platform.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.13.1/lodash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/2.1.0/benchmark.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-rc1/jquery.min.js"></script>
<script src="https://rawgit.com/ivolovikov/fastest-clone/master/index.js"></script>
<pre id="results"></pre>

JavaScript

// intial data
var source = {a:-1,b:1,c:1,d:1,e:1,f:1,g:1,
              h:{a:-1,b:1,c:1,d:1,e:1,f:1,g:1}};
var CloneFactory = FastClone.factory(source);

$result = document.getElementById('results');

var suite = new Benchmark.Suite;

// add tests
suite
.add('FastClone', function() {
  var clonned = new CloneFactory(source);
  
  // adding checking to prevent compiler optimization
  if (clonned.h.a != -1) throw new Error('Object not clonned');
  clonned.h.a = Math.random();
})
.add('lodash', function() {
  var clonned = _.cloneDeep(source);
  
  // adding checking to prevent compiler optimization
  if (clonned.h.a != -1) throw new Error('Object not clonned');
  clonned.h.a = Math.random();
})
.add('JQuery', function() {
  var clonned = $.extend(true, {}, source);
  
  // adding checking to prevent compiler optimization
  if (clonned.h.a != -1) throw new Error('Object not clonned');
  clonned.h.a = Math.random();
})
.add('Object.assign', function() {
  var clonned = Object.assign({}, source);
  
  // adding checking to prevent compiler optimization
  if (clonned.a != -1) throw new Error('Object not clonned');
  clonned.a = Math.random();
})

// add listeners
.on('cycle', function(event) {
  $result.innerHTML += (String(event.target)) + '\n';
})
.on('complete', function() {
  $result.innerHTML +='Fastest is ' + this.filter('fastest').map('name') + '\n';
})
// run async
.run({ 'async': false });