Web Storageの記事と同様に、
HTML5のサンプル集と
マイコミジャーナルのHTML5 API記事を参考に勉強してみました。
今回も、Jqueryを用いるので、導入されてない方は、
JavaScriptの記事を参考に、導入してください。
HTML5 APIのWeb Workersとは、バックグラウンドで動作するJavaScript(スレッド)を簡単に生成することができるAPIです。
・Workerの作成の方法(JavaScriptの記述)
// (1) 計算を行うワーカを生成
var worker = new Worker("worker1.js");
// (2) ワーカから結果を受け取る
worker.onmessage = function(event) {
alert("合計は" + event.data + "です。");
};
worker.onerror = function(error) {
alert(error);
};
// (3) ワーカに数値を渡す
worker.postMessage(num);
// (4) ワーカ側の処理
コールバック関数を用意してあげればよい模様
onmessage = function(event) {
var num = event.data;
var result = 0;
for (var i = 0; i <= num; i++) {
result += i;
}
// 生成元に結果を返す
postMessage(result);
};
今回の
サンプルも
参考サイトとほぼ同じ(Jqueryに変えただけ)ですが、参考サイトからダウンロードしたソースでは、Safari4で合計値が0になる現象が発生しました。
参考サイトのサンプルでは、Safari4でも動作していたので、ソースを見比べてみると、
worker.postMessage(num);
//worker.postMessage({num: num});
「参考サイトからダウンロードしたソース」と「参考サイト」では、上記の部分が違っていました。
原因をネットから調べていると、
このようなページを見つけました。
どうやら、Safari4は少し前の仕様に準拠しているようです。そのうちSafari4も新しい仕様に対応すると思われます。
