HTML 5学習のWebWorkマルチスレッド処理(八)
4684 ワード
マルチスレッド技術はサービス側技術の中ですでに発展して成熟しているが、Web側の応用ではずっと鶏の肋骨である.
新しい規格では、新しいWebWork APIが提供され、フロントエンドの非同期作業が非常に簡単になります.
使用:Workerオブジェクトを作成し、jsファイルを指し、Workerオブジェクトを介してjsファイルにメッセージを送信します.jsファイル内部の処理ロジックです.処理が完了したら、メッセージを現在のページに戻します.純粋な非同期方式で、現在のホームページのレンダリングに影響しません.
work.js
新しい規格では、新しいWebWork APIが提供され、フロントエンドの非同期作業が非常に簡単になります.
使用:Workerオブジェクトを作成し、jsファイルを指し、Workerオブジェクトを介してjsファイルにメッセージを送信します.jsファイル内部の処理ロジックです.処理が完了したら、メッセージを現在のページに戻します.純粋な非同期方式で、現在のホームページのレンダリングに影響しません.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
// work
var work = new Worker("work.js");
//
work.postMessage("100");
//
work.onmessage = function(event) {
alert(event.data);
};
</script>
</head>
<body>
</body>
</html>work.js
onmessage = function (event) {
// 1 num
var num = event.data;
var result = 0;
for (var i = 1; i <= num; i++) {
result += i;
}
postMessage(result);
}