首页 > Web开发 > 详细

web worker 更耗费 CPU 资源的任务

时间:2018-05-10 19:02:59      阅读:198      评论:0      收藏:0      [点我收藏+]

web worker的小例子,用来入门很合适,建议启动服务来开发。可以使用node的anywhere。

<!DOCTYPE html>
<html>

<body>

    <p>计数:
        <output id="result"></output>
    </p>
    <button onclick="startWorker()">开始 Worker</button>
    <button onclick="stopWorker()">停止 Worker</button>
    <br />
    <br />

    <script>
        var w;

        function startWorker() {
            if (typeof (Worker) !== "undefined") {
                if (typeof (w) == "undefined") {
                    w = new Worker("/demo_worker.js");
                }
                w.onmessage = function (event) {
                    document.getElementById("result").innerHTML = event.data;
                };
            }
            else {
                document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Workers...";
            }
        }

        function stopWorker() {
            w.terminate();
        }
    </script>

</body>

</html>

  当 web worker 传递消息时,会执行事件监听器中的代码。event.data 中存有来自 event.data 的数据。

  然后我们就可以从 web worker 发生和接收消息了,向 web worker 添加一个 "onmessage" 事件监听器。

/demo_worker.js
var i=0;

function timedCount()
{
i=i+1;
postMessage(i);
setTimeout("timedCount()",500);
}

timedCount();

以上代码中重要的部分是 postMessage() 方法 - 它用于向 HTML 页面传回一段消息  

web worker 更耗费 CPU 资源的任务

原文:https://www.cnblogs.com/yiyi17/p/9021048.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!