使用Web Worker
来源:互联网 发布:大二申请国外大学知乎 编辑:程序博客网 时间:2024/06/11 16:00
Web Worker是浏览器模拟了“线程”的方式在后台运行脚本。线程可以执行任务而不干扰用户主进程,也就是不影响页面,比如不会卡住。
Web Worker中不能处理大多数DOM和BOM
Web Worker通过消息机制和主线程通讯
Web Worker内的全局对象作用域仅限于其本身
Web Worker与主线程之间的对象传递是使用深拷贝的方式
Web Worker与主线程还可以通过转让所有权(参考资料5)来传递数据
Web Worker还可以创建子线程SubWorker
Web Worker可以被主线程关闭,也可以自我关闭
Web Worker也可以引入外部脚本
Web Worker启动有较高的时间和空间成本
专用worker
创建一个新的worker很简单。调用Worker() 的构造器,指定一个脚本的URI来执行worker线程(main.js):
var myWorker = new Worker('worker.js');专用worker中消息的接收和发送
通过postMessage() 方法和onmessage事件处理函数生效。向一个worker发送消息需要这样做(main.js):
first.onchange = function() { myWorker.postMessage([first.value,second.value]); console.log('Message posted to worker');}在worker中接收到消息后,写这样一个事件处理函数代码作为响应(worker.js):
onmessage = function(e) { console.log('Message received from main script'); var workerResult = 'Result: ' + (e.data[0] * e.data[1]); console.log('Posting message back to main script'); postMessage(workerResult);}回到主线程,我们再次使用onmessage以响应worker回传的消息:
myWorker.onmessage = function(e) { result.textContent = e.data; console.log('Message received from worker');}在这里我们获取消息事件的data,就是worker返回的信息
参考:
https://developer.mozilla.org/zh-CN/docs/Web/API/Web_Workers_API/Using_web_workers
http://blog.csdn.net/zwjabcd/article/details/50339135
http://blog.csdn.net/dojotoolkit/article/details/25030289
阅读全文
0 0
- HTML5 Web Worker使用
- web worker的使用
- 使用Web Worker
- HTML5 Web Worker的使用
- HTML5 Web Worker的使用
- HTML5 Web Worker的使用
- HTML5 Web Worker的使用
- HTML5 Web Worker的使用
- JavaScript---Web Worker使用教程
- Web Worker
- web worker
- web worker
- Web Worker
- html5 web worker 和serverSend使用
- H5 web worker线程的使用
- 使用Service Worker提升Web应用体验
- 使用Web Worker创建多线程应用
- 在WebGL应用中使用Web Worker提升效率
- Codis2迁移到Codis3
- Navigation Drawer的基本用法(SlidingMenu的替代品)
- Kotlin的Spring之旅(二):AOP(面向切面编程)
- 电商时代已经要过去了。接下来是零售
- day01
- 使用Web Worker
- Redux(1)
- Hdu 1531 King 差分约束 解题报告
- HDU-2571-命运
- 悲观锁和乐观锁的区别和应用场景
- netty工程,JAVA解析BCD码,BIN码
- Eclipse中出现Type 'xxxx' could not be resolved的处理方法
- Hive的基本使用
- Linux c语言之关键字复习