Web Workers in Javascript

/* -----------------------------Index.JS--------------------------*/

  // Check if web worker functionality is available for the browser
        if(window.Worker){
        
            // Creating new web worker using constructor
            var worker = new Worker('worker.js');
            
            
            var message = 'Hello';
        
            // Sending the message using postMessage
            worker.postMessage(message);
            
            // On response
            worker.onmessage = function(e) {
                console.log(e.data);
            };
        
        }


/* -----------------------------Worker.JS--------------------------*/

// Waits for any activity from the page
self.onmessage = function(e) {
    if(e.data !== undefined) {
        // Do work 
        var total = e.data + ' World';
        // Posting back to the page
        self.postMessage(total)
    }
}
// Terminate with: worker.terminate()

/* -----------------------------Index.JS--------------------------*/
const delay = 5000;

// Get element of without worker button
const noWorkerBtn = document.getElementById('worker--without');
// Add event listener to the button itself
noWorkerBtn.addEventListener('click', () => {
    // Define the starting time
    const start = performance.now();
    // Do complex calculations
    while (performance.now() - start < delay);
    // Get the ending time
    const end = performance.now();
    // Calculate the difference in time
    const resWithoutWorker = end - start;
    // Log the result
    console.log('No worker:', resWithoutWorker);
    
});

// Define a worker
const worker = new Worker('./worker.js');

// Get element of with worker button
const workerBtn = document.getElementById('worker--with');

// Add event listener to the button
workerBtn.addEventListener('click', () => {
    // Send delay number
    worker.postMessage(delay);
    
});
// On message from worker
worker.onmessage = e => {
    // Log the result
    console.log("With worker: ", e.data);
};

/* -----------------------------Worker.JS--------------------------*/

// On message received
this.onmessage = e => {
    // Delay equals to data received
    const delay = e.data;
    // Define starting time
    const start = performance.now();
    // Do the complex calculation
    while (performance.now() - start < delay);
    // Get ending time
    const end = performance.now();
    // Calculate difference
    const resWithWorker = end - start;
    // Send result
    this.postMessage(end - start);
};