web worker 更耗费 CPU 资源的任务

Posted 地铁程序员

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了web worker 更耗费 CPU 资源的任务相关的知识，希望对你有一定的参考价值。

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 资源的任务的主要内容，如果未能解决你的问题，请参考以下文章

web worker原理

HTML5(四)——Web Workers

nginx优化CPU配置worker_cpu_affinity

javascript：Web Worker

nginx worker_cpu_affinity使用方法

如何查询耗费CPU最多的SQL语句