JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://nhanfu.github.io/htmljs/dist/html.js"></script>
<div id="container">

</div>

JavaScript

var randomFruits = ['Apple', 'Orange', 'Banana', 'Mango', 'Kiwi', 'Apricot', 'Avocado',
'Cherry', 'Coconut', 'Fig', 'Grape', 'Pear', 'Peach', 'Lime'],
	fruitArr = html.observableArray([]),
  index = 0,
  len = randomFruits.length,
  price;

for (var i = 0; i < 100000; i++) {
	index = Math.floor(Math.random() * len);
  price = Math.floor(Math.random() * 5) + 5; // from $5 - $10
	fruitArr.add({name: randomFruits[index], price: price});
}

var start = new Date();

html('#container').table.tbody.each(fruitArr, function (fruit) {
	html.tr
  		.td.text(fruit.name).$
      .td.text('$').text(fruit.price).$
});

var stop = new Date();
alert(stop - start);