JavaScript是单线程,因此可能导致阻塞UI线程。Web Workers可以让Web应用程序具备后台处理能力,对多线程的支持非常好,但不能在Web Workers中执行的脚本访问页面的window对象,即Web Workers不能直接访问DOM API。
Web Workers API的使用:
1、浏览器支持检查:
if (typeof(Worker) === "undefined") //true为不支持Web Workers
2、创建Web Workers:
创建时接受一个JavaScript文件的URL地址,必须是同源文件(相同协议、主机和端口)。
var worker = new Worker("worker.js") ;
(1)内连Worker
启动一个worker需要就像引入一个文件。 <script id="myWorker" type="javsscript/worker">
不是设置了script的type属性就能让JavaScript代码以Web Worker方式运行;
(2)共享Worker
共享Worker与普通Worker相似,区别在于它能够为同源的多个页面所共享,引入了端口的概念用于PostMessage通信,对于多个页面间的数据同步以及若干标签共享一个持久资源的情况,大有用武之地。
var shareWorker = new ShareWorker("shareWorker.js") ;
3、多个JavaScript文件的加载和执行
对于多个JavaScript文件组成的应用程序,可以通过<script>元素方式,在页面加载时同步加载多个文件,但Web Woker没有访问document对象权限,所以要使用另一种方法导入(importscript)。
importscript("helper.js") ;
可以多个脚本,会顺序执行: importscript("helper.js", "other.js") ;
4、与Web Worker通信:
生成Web Worker,可以使用postMessage API传送和接收数据。
5、Web Worker的停止:
Web Worker不能自行终止,但能够被启用他们的页面终止,如果关闭了页面,Web Worker会被垃圾回收
worker.terminate() ; //终止worker
6、Web Worker的嵌套使用:
Worker API能够在Web Worker脚本中嵌套使用,创建子Worker。
var subworker = new Worker("subWorker.js")
Worker虽然不能访问window对象,但可以与定时器API协。
var t = setTimeout(postMessage, 200, "delayed message") ;