使用sharedwoker

sharedworker的输出

对于alert函数

Web Worker无法调用alert()。如果不小心在worker中某处调用了alert,那么该worker文件中的代码都不执行。

用console.log输出

在chrome中:

不稳定,有时有输出,有时没有。大部分情况下console.log不输出。

而且,worker中使用console.log有限制

Limitation

There is a small limitation with it though, It can only output primitives (strings, numbers, booleans) sometimes single dimension arrays.

And it can only take the first argument within the console log.

Normal Console log:

console.log("status:", _status); // status: working
console.log({ status: _status }); // { "status": working }

Worker Console log:

console.log("status:", _status); // status:
console.log({ status: _status }); // [object Object]

You could use console.log(JSON.stringify({ status: _status })); but this would not handle circular referencing objects and will not output in a pretty/easy to read objects.

在firefox中:

console.log可以正常输出

worker中创建worker

使用new Worker("worker.js")创建worker对象时,FireFox允许在worker.js文件中再次用new Worker(' subworker.js')创建worker.

若用new SharedWorker('worker.js')创建worker对象,FireFox则不允许worker.js文件中再次创建worker.

不论用何种worker对象,Chrome都不支持在worker中创建worker

可以通过Error事件捕捉错误信息

var worker = new Worker("scripts/lengthytask.js");
worker.addEventListener("error", function(evt){
alert("Line #" + evt.lineno + " - " + evt.message + " in " + evt.filename);
}, false);

worker和一般js文件一样,也可以在浏览器中调试

sharedworker的终止

SharedWorker进程会在所有连接断开后自动回收

使用sharedworker

html页面中

<script>

 var myWorker2 = new SharedWorker("worker2.js");
myWorker2.port.start();
 myWorker2.port.postMessage("esteblishing sharedworker.");
 myWorker2.port.onmessage = function(e) {
    var textContent = e.data;
    console.log('in main file.Message received from sharedworker'+textContent);
  }

</script>

在worker2.js中

onconnect = function(e) {
    var port = e.ports[0];
    console.log('hello');
    port.addEventListener('message', function(e) {
      var workerResult =e.data;
      console.log(workerResult);
      port.postMessage("in sharedworker.you have sent the following:"+workerResult);
    });

    port.start(); // Required when using addEventListener. Otherwise called implicitly by onmessage setter.
}
或者

onconnect = function(event) {
// event.source包含对客户端端口的引用
var clientPort = event.source;
// 侦听该客户端发来的消息
clientPort.onmessage = function(event) {
// event.data包含客户端发来的消息
var data = event.data;
....
// 处理完成后发出消息
clientPort.postMessage('processed data');
}
};
多个Worker线程

官方规范指出worker属于相对重量级并能长期运行在后台的脚本。所以,由于Web worker的高启动性能成本和高进程内存成本,它们的数量不宜过多。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值