Untitled

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Web Workers Example</title>
    <script>
        let myWorker;
        function startWorker(){
            var para = document.createElement("P");
            para.innerText = "Worker Started";
            document.body.appendChild(para);
            if (window.Worker) {
                myWorker = new Worker('worker.js');
                myWorker.onmessage = function (e) {
                    var para = document.createElement("P");
                    para.innerText = e.data;
                    document.body.appendChild(para);
                };
            }
        }
        function terminateWorker(){
            if(myWorker!=undefined){
                myWorker.terminate();
                myWorker=undefined;
                var para = document.createElement("P");
                para.innerText = "Worker Terminated";
                document.body.appendChild(para);
            }
        }
        function checkBlocking() {
            var para = document.createElement("P");
            para.innerText = "It works, not blocked by CPU expensive operation";
            document.body.appendChild(para);
        }
    </script>
    <style>
        button {
            display: inline-block;
            padding: 10px 20px;
            background: #2196F3;
            color: white;
            cursor: pointer;
            border: none;
            font-size: 16px;
            margin: 30px;
        }
    </style>
</head>

<body>
    <button onclick="startWorker()">Start Worker</button> <br>
    <button onclick="terminateWorker()">Terminate Worker</button><br>
    <button onclick="checkBlocking()">Test browser responsive</button>
</body>

</html>