JSFiddle - React, Tailwind, and code Playground

by _sir

HTML

<div id="moo">
</div>

JavaScript

var $d = $('#moo'),
    i = 0,
    j = 0,
    startTime = (new Date()).getTime();

// Expose a function so the async script can see it.
window.foo = function(instr) {
    
    var tEnd = (new Date()).getTime(),
        timeDiff = tEnd - startTime;
    
        instr = instr || "foo()";
    
    $d.append("<p>" + tEnd + " &mdash; " + instr + " called after " + timeDiff + " ms with " + j + " loop timers done.</p>");

    setTimeout(function(){
        var tNow = (new Date()).getTime(),
            t2 =  tNow - tEnd;
        $d.append("<p>" + tNow + " &mdash; " + instr + " 10ms timer done after " + t2 + " ms and " + j + " loop timers.</p>");
    }, 10);
};

window.bar = function(){
    foo("bar()");
};

// Add en event handler
$d.on('myEvent', function() {
    var tNow = (new Date()).getTime();
    $d.append("<p>" + tNow + " &mdash; myEvent was triggered with " + j + " loop timers.</p>");
        
});

// Append a script right away;
$d.append('<p>' + (new Date()).getTime() + ' &mdash; Script Appended (calls foo immediately).</p><scr' + 'ipt> foo(); </scr' + 'ipt>');

// Create a one-second timeout
setTimeout(function() { 
    var tNow = (new Date()).getTime(),
        timeDiff = tNow - startTime;
    
    $d.append("<p>" + tNow + " &mdash; One-second timer run after " + timeDiff.toString() + " ms with " + j + " loop timers.</p>"); 
    
    $d.append("<p>" + tNow + " &mdash; Script Appended (calls bar immediately).</p>"); 
    
    // Append a script to execute asynchronously
    $d.append('<scr' + 'ipt> bar(); </scr' + 'ipt>');
    
}, 1000);

// Append a script right away;
$d.append('<p>' + (new Date()).getTime() + ' &mdash; One-second setTimeout added. Starting two second loop.');

// Loop for two seconds, making 10ms timers all along the way.
while ((new Date()).getTime() < startTime + 2000) {
    i++;
    // Create MANY timers
    setTimeout(function(){
        j++;
    }, 10);
}

// Event trigger happens when the loop finishes, before the timers are...