JSFiddle - React, Tailwind, and code Playground

by fresheyeball

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css">
<div>
    Digest time : <span id="time">?</span>
    <button>Update</button>
    <br/>
    <table class="table table-striped">        
        <tbody>
        </tbody>    
    </table>
</div>

CoffeeScript

COLUMNS_LENGTH = 5
ROWS_LENGTH    = 200

$ ->
    rows = []
    rand = Math.floor Math.random() * 5000
    html = ''
    for i in [0...ROWS_LENGTH]
        html += "<tr>"
        html += "<td></td>" for j in [0...COLUMNS_LENGTH]
        html += "</tr>"
    
    tds = $('tbody').html(html).find 'td'
    
    console.log tds.length
    
    update = ->
        i = 0
        rand = Math.floor Math.random() * 5000
        for j in [0...ROWS_LENGTH]            
            for k in [0...COLUMNS_LENGTH]
                tds[i].innerHTML = "cell #{rand} | #{k+1}, #{j+1}"
                i++
    update()    
    
    $('button').on 'click', ->        
        now = Date.now()
        update()
        $('#time').html "#{Date.now()-now}ms"