2016-12-13 14 views
3

私はJavaScriptイベントループとWebワーカーの使用に関して、同僚と長い話をしてきました。単一のWebページでは、異なるWeb労働者が異なるスタック、ヒープ、およびメッセージ・キューは、具体的に形here、持っている:JavaScriptイベントループとWebワーカ

A web worker or a cross-origin iframe has its own stack, heap, and message 
queue. Two distinct runtimes can only communicate through sending messages via 
the postMessage method. This method adds a message to the other runtime if the 
latter listens to message events. 

を同じイベントループ内で実行されるすべてのメッセージがある、または各Webワーカーが持っているその自身のイベントループ?

私はページに2人のWebワーカーがいるため、非常に計算量の多い操作を順番に実行し、もう1人はWebRTC接続を処理するだけなので、この質問をしています。 詳細については触れませんが、計算量の多いWeb WorkerがJavaScriptイベントループから計算時間を奪い取っているように見えます。他のWorkerは、接続を維持するだけです(ハートビートを仮定すると)はこれを行うことができず、接続は最終的に失われます。

これは私が信じるものです。そうでない場合、2つのWebワーカーが異なるイベントループで動作する場合、コンピューティングWebワーカーの負荷が重い場合(負荷が軽い場合は接続が失われない場合)、接続が失われる理由を説明できません。

答えて

3

各ワーカーには独自のイベントループがあります。 the specificationから:

WorkerGlobalScopeオブジェクトは、関連類似起源閲覧コンテキストのユニットによって使用されるものとは別の別個のイベントループを有しています。

、その後here

グローバルスコープは、労働者の "内部" です。

...これは、先に引用したWorkerGlobalScopeインターフェイスの定義が続きます。

計算量の多い作業者が処理時間を支配している可能性がありますが、他の作業者のイベントループはブロックしていません。

我々はまた、容易に簡単なテストでこれを確認することができます。

page.html

<!DOCTYPE HTML "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Two Workers</title> 
<style> 
body { 
    font-family: sans-serif; 
} 
pre { 
    margin: 0; 
    padding: 0; 
} 
</style> 
</head> 
<body> 
<div>Fast: <span id="fast"></span></div> 
<div>Slow: <span id="slow"></span></div> 
<script> 
(function() { 
    var fastWorker = new Worker("fastworker.js"); 
    var fast = document.getElementById("fast"); 
    var slowWorker = new Worker("slowworker.js"); 
    var slow = document.getElementById("slow"); 

    fastWorker.addEventListener("message", function(e) { 
     fast.innerHTML = e.data || "??"; 
     fastWorker.postMessage("ping"); 
    }); 

    slowWorker.addEventListener("message", function(e) { 
     slow.innerHTML = e.data || "??"; 
     slowWorker.postMessage("ping"); 
    }); 

    fastWorker.postMessage("start"); 
    slowWorker.postMessage("start"); 
})(); 
</script> 
</body> 
</html> 

slowworker.js

var counter = 0; 
self.addEventListener("message", function(e) { 
    var done = Date.now() + 1000; // 1 second 
    while (Date.now() < done) { 
     // Busy wait (boo!) 
    } 
    ++counter; 
    self.postMessage(counter); 
}); 

fastworker.js

var counter = 0; 
self.addEventListener("message", function(e) { 
    var done = Date.now() + 100; // 100ms 
    while (Date.now() < done) { 
     // Busy wait (boo!) 
    } 
    ++counter; 
    self.postMessage(counter); 
}); 

ご覧のとおり、「高速」の番号は「遅い」よりもはるかに高速になり、メッセージを処理していることがわかります。

+1

(私は1つのワーカーファイルを作り、startコマンドで遅延を送ったが、...ている可能性が)私は* *マシンの使用可能な処理時間を支配する労働者について考え、それは少しを鳴らし私はそれが起こるとは思わなかった。とにかくお返事いただきありがとうございます。 :)私は私の遅い労働者の問題に回避策を見つけることを試みる。 – Masiar

関連する問題