浏览器在重定向之前等待Web worker完成

Question

我正在使用仪表板网页，它有5个不同的方框，显示繁重查询的结果，通常一次查询数月的数据。

每个查询可能需要3到7秒才能执行并返回数据。

我想从UI角度尝试实现的是在后台运行这些查询，让UI可以自由地重定向到另一个页面。

我的第一个尝试是Jquery.ajax（）调用，问题是： 假设我有5个查询要运行我进行5个ajax调用，在此示例中，浏览器正在等待查询＃3，用户点击a需要5秒，而我的期望是浏览器立即重定向到谷歌，而不是它正在等待任务3完成，然后忽略查询4和5（这是好的）并去谷歌。 但由于taks 3需要5秒，因此用户需要等待5秒钟才能获得他未使用的数据。

我将我的实现更改为Web worker，结果是一样的。

我发布了一个简化版的代码来表达我的观点。 我在Chrome中执行了此代码，我得到的结果是重定向直到sleep（10）秒结束才会发生。 我想在用户点击链接后立即重定向。

webWorkerTest.html

<script>
    if(window.Worker){

        var myWorker = new Worker("worker.js");
        var message = { goToTheServer: true };

        myWorker.postMessage(message);

        myWorker.onmessage = function(e){
            console.log(e.data.result);
        };
    }

</script>

<a href="http://www.google.com">Google</a>

worker.js

this.onmessage = function(e){

    if(e.data.goToTheServer != undefined){

        var ajaxResult = goToTheServer(
            function (resultado){
                this.postMessage({result: resultado});
            }           
        );
    }
};


function goToTheServer(callback) {

    var xmlhttp = new XMLHttpRequest();

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == XMLHttpRequest.DONE ) {
           if (xmlhttp.status == 200) {

               callback(xmlhttp.responseText);                     
           }           
        }
    };

    xmlhttp.open("GET", "ajax.php", true);
    xmlhttp.send(); 
}

ajax.php

<?php

sleep(10); //heavy query
echo 1984;