2016-10-18 3 views
0

この問題は、巨大で複雑なアプリケーションで深刻化しましたが、簡単な使用例で再現することができます。メインブラウザのスレッドがビジー状態の場合は、 Webワーカーから送信されたXHRは、ほとんどの場合、作業者が0msのタイムアウトを掛けた通常の機能であるかのように、 はメインスレッドのターンを待っています。これは実際に起こっていることではありません。並行処理が行われているのですが、ログエントリの のタイミングからわかりますが、XMLHttpRequestの実際の送信は、メインのJavascriptスレッドがフリーの場合にのみ可能です。XHRを送信するとき、Webワーカーは本当に並行していませんか?

最初は、この動作はInternet Explorerに限られていたと考えていましたが、実際には ユースケースではIEの方がはるかに遅いため、このようにしか見えません。この並行しない動作は、私が試したすべてのブラウザ(IE、 Chrome、Firefox)に実際に存在します。ブラウザはまったく同じように動作しません。open()コールをブロックしたり、send()をブロックすることがあります。 send()がタイムリーに完了したと主張しますが、Fiddlerメインのブラウザスレッドが長時間実行されたタスクを終了するまで、データが実際に サーバーに送信されなかったことを示しています。

私はこれがなぜ、誰かに教えてくれることを望んでいます。ウェブワーカーに適切な並行方法でXHRを送信させる方法があれば教えてください。ところで、私は は、全体的な問題の要点は、メインのJavascriptのスレッドがどのくらい忙しいか知っているので、それを修正するように教えてください。私たちであり、それも ですが、長時間実行されている課題は、非常に複雑なJSベースのUIを顧客のアプリケーションでリフローされているため、私たちはそこでできることを に限定しています。

このREPRO場合は、問題を示しています

<html> 
<body> 
<div id="test"></div> 
<script> 
worker = new Worker('worker.js'); 
// Wait for 2 seconds to be as sure as we can be that it has downloaded and installed the worker code 

setTimeout(proceed, 2000); 

function proceed() { 

    worker.postMessage(""); 
    console.log("Message sent to worker: " + new Date().getTime()); 

    // Now tie up the JS thread 
    setTimeout(function() { 
     console.log("Started crazy pointless loop: " + new Date().getTime()); 
     for (var i = 0; i < 500000; i++) { 
      var j = i/17, 
       k = j * j, 
       l = k/123; 
      document.getElementById("test").innerHTML = "l = " + l; 
     } 

     console.log("Finished crazy pointless loop: " + new Date().getTime()); 
    }, 0); 
} 
</script> 
</body> 
</html> 

とworker.jsファイル:あなたは既にしているので、あなたが労働者からの同期XHRを送信したほうが良いと思います

addEventListener('message', function(e) { 

    var xhr = new XMLHttpRequest(); 
    xhr.onreadystatechange = function() { 
     if (xhr.readyState < 4) return; 
     console.log("Response received: " + new Date().getTime()); 
    } 
    console.log("Ready to open XHR: " + new Date().getTime()); 
    xhr.open("GET", "dummy.html?nocache=" + new Date().getTime(), true); 
    console.log("XHR opened: " + new Date().getTime()); 
    xhr.send(); 
    console.log("XHR sent: " + new Date().getTime()); 

}, false); 
+0

私はこれをサポートするためのデータがありませんので、これは答えではありません。しかし、私は、すべてのブラウザがメインスレッドを使用して、指定されたドメインへの同時接続数を制限していることを強く疑う。 HTTP 1.1では、任意のドメインに対して2以下を指定します。ほとんどのブラウザは制限値の低い_を尊重していませんが、それらはすべてメインスレッドを介して強制される上限があります。詳細については、http://stackoverflow.com/questions/985431/max-parallel-http-connections-in-a-browserを参照してください。 –

答えて

1

別のスレッドで動作しています:

addEventListener('message', function(e) { 
    var xhr = new XMLHttpRequest(); 
    console.log("Ready to open XHR: " + new Date().getTime()); 
    xhr.open("GET", "dummy.html?nocache=" + new Date().getTime(), false); // false makes it synchronous 
    console.log("XHR opened: " + new Date().getTime()); 
    xhr.send(); 
    console.log("Response received: " + new Date().getTime()); 
}, false); 
関連する問題