JSFiddle - React, Tailwind, and code Playground

by gravof

HTML

<html>
<head>
    <title>Non-blocking JS blocks Opera</title>
    <script>
        var script = document.createElement('script');
        script.src = "http://stevesouders.com/bin/sleep.cgi?type=js&sleep=5&expires=-1&last=0&t=1323749841";
        var firstScript = document.getElementsByTagName( 'script' )[0];
        firstScript.parentNode.insertBefore(script, firstScript);
    </script>
</head>
<body>
    <img src="http://stevesouders.com/bin/sleep.cgi?type=gif&sleep=1&expires=-1&last=0&imagenum=1&t=1323749842">
    <img src="http://stevesouders.com/bin/sleep.cgi?type=gif&sleep=1&expires=-1&last=0&imagenum=2&t=1323749843">
    <img src="http://stevesouders.com/bin/sleep.cgi?type=gif&sleep=1&expires=-1&last=0&imagenum=3&t=1323749844">
    <img src="http://stevesouders.com/bin/sleep.cgi?type=gif&sleep=1&expires=-1&last=0&imagenum=4&t=1323749845">
    <img src="http://stevesouders.com/bin/sleep.cgi?type=gif&sleep=1&expires=-1&last=0&imagenum=5&t=1323749845">
    <img src="http://stevesouders.com/bin/sleep.cgi?type=gif&sleep=1&expires=-1&last=0&imagenum=6&t=1323749846">
    <img src="http://stevesouders.com/bin/sleep.cgi?type=gif&sleep=1&expires=-1&last=0&imagenum=7&t=1323749847">
    <h2>The problem</h2>
    <p>In Opera (both the stable version 11.60 and Opera Next 12.00 alpha), images won't start to download until the script is finished downloading (which takes 5 seconds).</p>
    <p>The code that dynamically loads this js script seems to be very popular. Everybody advocates it. But since it blocks rendering &amp; downloading in Opera, I'm not sure why that's the case. Did I do anything wrong?</p>
    <h2>Flow chart in my Opera Next:</h2>
    <img...