如何debug web worker

Web Workers 为 Web 前端网页上的脚本提供了一种能在后台进程中运行的方法。一旦它被创建,Web Workers 就可以通过 postMessage 向任务池发送任务请求,执行完之后再通过 postMessage 返回消息给创建者指定的事件处理程序 ( 通过 onmessage 进行捕获 )。

例子:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<title>Test Web worker</title> 
<script type="text/JavaScript"> 
function init(){ 
var worker = new Worker('js/compute.js'); 

worker.onmessage= function (event) { 

document.getElementById("result").innerHTML += 
event.data+"<br/>"; 
}; 
} 
</script> 
</head> 
<body onload="init()"> 
<div id="result"></div> 
</body> 
</html>

compute.js:

var i=0; 

function timedCount(){ 
 for(var j=0,sum=0;j<10000;j++) { 
    for(var i=0;i<1000;i++){ 
          sum+=i; 
    } 
 } 
 postMessage(sum); 
} 

postMessage("Before computing,"+new Date()); 
timedCount(); 
postMessage("After computing,"+new Date());

在web worker的source code里设置断点,选取Puase on start的checkbox:

之后就能像debug 普通javascript code一样debug worker代码:

要获取更多Jerry的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏十月梦想

Express框架之路由初识

Express框架是后台的Node框架,所以和jQuery、zepto、yui、bootstrap都不一个东西。

473
来自专栏Python小屋

1000道Python题库系列分享13(22道填空题)

712
来自专栏星回的实验室

JavaScript中的沙箱机制探秘

最近有需求要研究下开放给用户的自动化工具,于是就顺便整理了下沙箱的相关问题。Sandbox,中文称沙箱或者沙盘,在计算机安全中是个经常出现的名词。Sandbox...

1032
来自专栏架构师小秘圈

互联网安全威胁及应对方案

作者:蒋海滔,阿里巴巴国际事业部,高级技术专家,爱好Java/JavaScript,长期关注高性能、并发编程以及Web安全。 来自:高可用架构(ID:ArchN...

3544
来自专栏智能大石头

最终版 Reflector v1.0 (+简单的反流程混淆)

(0415增加简单的反流程混淆功能,满足日常使用需要,不再更新,转向ILSpy,见12点后面) Reflector过期?这可不行!自己动手吧! 看雪上拿到Ref...

1835
来自专栏刘望舒

热修复原理之热修复框架对比和代码修复

题外话 今天听到了著名物理学家史蒂夫霍金去世消息,潸然泪下。作为一个天文迷,感谢霍金带给我的那些天文知识。十分敬佩霍金的身残志坚,他在全身瘫痪无法言语情况下仍旧...

3084
来自专栏性能与架构

影子(Shadow) DOM

什么是 Shadow DOM? Shadow DOM 是一个革命性的新技术,先来看下他是什么样子的 以<video>标签为例非常适合,例如 <video ...

3168
来自专栏双十二技术哥

MultiDex(三)之异步加载优化

在上一篇文章《Multidex(二)之Dex预加载优化》中我们提到主进程中直接开启一个子线程执行MultiDex的工作确实可以避免ANR的问题,然而此时主进程中...

1185
来自专栏QQ音乐技术团队的专栏

OpenSL ES那些事

本次分享主要是将JNI层的声音采集,传输以及播放过程做相应介绍,若是大家有更好的优化建议,欢迎指教。

1.5K7
来自专栏张善友的专栏

微软反跨站脚本库3.0 RTM

跨站脚本Cross-Site Scripting(XSS)又叫CSS (Cross Site Script) ,跨站脚本攻击。它指的是恶意攻击者往Web页面里插...

1756

扫码关注云+社区