JSFiddle - React, Tailwind, and code Playground

HTML

<p>Count numbers: <output id="result"></output></p>
<button onclick="startWorker()">Start Worker</button> 
<button onclick="stopWorker()">Stop Worker</button>
<br><br>

JavaScript

var worker = null;
var val = 0;

// check if Worker API is available in this browser
if(typeof(Worker)==="undefined") {
    document.getElementById("result").innerHTML="Your browser does not support Workers.";
    return;
}


/**
 * This function is run by the worker.
 */
var workerCode = function() {
    // repeatedly count up a single number and send it back to window
    var postNumber = function(val) {
        setTimeout(function() { postMessage(++val); postNumber(val); }, 300);
    }
    
    // call postNumber on worker start
    onmessage = function(e) { postNumber(e.data); };
    
    // FYI: window is undefined in Worker
    // console.log(typeof(window));
};

/**
 * Starts the worker.
 */
window.startWorker = function() {
    if (worker) return;
    
    // the code in the form of a string
    //var code = document.getElementById("workercode").innerHTML;
    var code = "(" + workerCode.toString() + ")();";
        
    // Obtain a blob URL reference to our virtual worker 'file'.
    var blob = new Blob([code]);
    var blobURL = window.URL.createObjectURL(blob);
    worker = new Worker(blobURL);
    worker.postMessage(val); // Start the worker at the last given value
    worker.onmessage = function (event) {
        document.getElementById("result").innerHTML = event.data;
        val = event.data;
    };
};

/**
 * Stops the worker.
 */
window.stopWorker = function() {
    if (!worker) return;
    
    worker.terminate();
    worker = null;
};