BABUKUMA (^(工)^): Web Workersを試してみた。

今回、Web Workersを試してみた。

JavaScriptで簡単にスレッドが使えるのが便利だったけど、

まだ、スレッドに引数はどうやれば渡せるのかがわからなくて、ちょっと不便なところもあった。

参照したサイトは　http://www.whatwg.org/specs/web-workers/current-work/

### test.html ###


<!DOCTYPE HTML>
<html>
 <head>
  <title>babukuma web workers event test</title>
 </head>
 <body>
  <table border=1>
    <tr>
      <th>thread 1</th>
      <th>thread 2</th>
    </tr>
    <tr>
      <td><ul id="result1"></ul></td>
      <td><ul id="result2"></ul></td>
    </tr>
  </table>
  <script>
   var worker1 = new Worker('worker.js');
   worker1.onmessage = function (event) {
     var liTag = document.createElement("li");
     var textNode = document.createTextNode(event.data);
     liTag.appendChild(textNode);
     document.getElementById('result1').appendChild(liTag);
   };
   
   worker1.onerror = function (event) {
     var liTag = document.createElement("li");
     var textNode = document.createTextNode("message : " + event.message);
     liTag.appendChild(textNode);
     document.getElementById('result1').appendChild(liTag);
   };
   
   var worker2 = new Worker('worker.js');
   worker2.onmessage = function (event) {
     var liTag = document.createElement("li");
     var textNode = document.createTextNode(event.data);
     liTag.appendChild(textNode);
     document.getElementById('result2').appendChild(liTag);
     
     if(event.data == 6) {
       worker2.terminate();
       
       var liTag = document.createElement("li");
       var textNode = document.createTextNode("terminate");
       liTag.appendChild(textNode);
       document.getElementById('result2').appendChild(liTag);
     }
   };
   
   worker2.onerror = function (event) {
     var liTag = document.createElement("li");
     var textNode = document.createTextNode("message : " + event.message);
     liTag.appendChild(textNode);
     document.getElementById('result2').appendChild(liTag);
   };
  </script>
 </body>
</html>

### worker.js ###


var index = 0;

var babukumaThread = function() {
 if(index == 8) {
   throw 'babukuma error!!!';
 }
 postMessage(index);
 index++;
 setTimeout(babukumaThread, 1000);
}

babukumaThread();

IEとOperaではまだWebWorkersが使えないみたいで、試せなかった。

FireFoxとGoogle Chromeでテストしてみたけど、

なぜかちょっと結果が違う。

Chromeではonerrorイベントが発生してないみたい。。

俺が何か間違ったのかな？

後でShared Workersも試してみよう。

2009年10月2日金曜日

Web Workersを試してみた。