随着Web应用复杂性的与日俱增,越来越复杂的计算在所难免,长时间运行的javaScript
进程会导致浏览器冻结用户界面,让人感觉屏幕冻结了。Web Works
通过让javaScript
在后台以线程、进程、运行在其他处理器上的线程或进程解决了这个问题。也就是说可以通过开启多线程、进程来解决这问题。
并且兼容性很好。
使用Web Worker
在页面中开启一个Web Worker
,它处理完数据以后可以与页面进行通信,讲数据处理后得到的结果传给页面。
创建
var worker = new Worker('xxx.js')
这里会导致浏览器下载这个文件,并且等待接受开始的命令
给Worker传递开始的消息
给Worker
传递消息可以使用worker.postMessage(msg)
,msg
可以是一个字符串,也可以是任何一个可以被序列化为JSON
的值,例如对象。而且需要注意postMessage
是异步的。
Worker处理完成与页面进行通信
可以绑定两个事件message
、error
事件,其中message
事件的参数为event
,注意不是事件对象,只是一个名字,在event.data
中就可以得到来自worker
的数据。
当worker
出错时就会触发error
事件,参数为一个event
对象,包含以下属性:
- filename: 文件名
- lineno: 出错的行号
- message: 错误信息
如果想停止worker
的工作,可以在任何时候调用worker.terminate()
,会立即终止,并且不会触发任何事件。
Worker的全局作用域
worker
所执行的javaScript
代码完全在另外一个作用域,与当前页面中的代码不能共享作用域。而且完全不能访问DOM
。它的全局对象this
和self
都指向的是这个wroker
对象。在这个作用域中功能非常有限。当页面在worker
对象上调用postMessage
的时候,为了处理来自页面的数据,也需要绑定message
事件。
this.onmessage = function(event) {
var data = event.data
}
在页面内部可以调用this.close()
来停止工作
包含其他脚本
在内部可以使用importScript()
,来包含其他脚本,它接收一个或多个指向外部脚本的URL
,每个加载过程都是异步的,并且加载完成之后会 按顺序执行。