关于web-worker:多线程开发之-Web-Worker

咱们都晓得,浏览器执行js代码是单线程的,当页面脚步执行时,页面是没方法响应别的的,直到脚步的完结,而这里介绍的WebWorkers就能够扭转这所有。 WebWorkers是运行在后盾的js代码,独立于其余脚本,不会影响页面的性能。咱们能够持续做任何违心做的事件:点击、选取内容等等,而此时WebWorkers在后盾运行。 所有支流浏览器均反对 web worker,除了 Internet Explorer。生成worker调用Worker()构造函数,指定一个要在worker线程内运行的脚本的URI,例子是以后页面指定worker线程执行的脚步为script-worker.js。 var myWorker = new Worker("script-worker.js");在script-worker.js外面咱们能够执行额定的代码,这些代码的执行不会影响页面去干别的你想干的事件,这听起来很棒。 传递数据页面能够和worker交互传递数据,这样worker在不影响页面干有意义的事件的状况下能够默默去计算,好了通知一下页面,应用这些数据。 //[主页面代码]myWorker.postMessage("data-from-mainpage");//[worker代码]onmessage = function (oEvent) { console.log("主页面发送过去的数据是:"+oEvent.data)); };下面是【主页面发送数据给worker脚本】的状况,是的,你看见了十分亲切的postMessage,好吧,我喜爱这个货色。 //[主页面代码]myWorker.onmessage = function (oEvent) { console.log("worker脚本发送过去的数据是:"+oEvent.data));};//[worker代码]postMessage("data-from-mainpage");下面是【worker脚本发送数据给主页面】的状况,仍旧很简略,不过这些只是API,关键在于奇妙的应用才是无益的。 此外,可能worker执行会出错,主页面通过: myWorker.onerror=function(oEvent){};能够监听worker产生谬误。 补充阐明worker线程可能在不烦扰UI的状况下执行工作,所执行的JavaScript代码齐全在另一个作用域,与以后网页中的代码不共享作用域。 Worker的全局作用域中提供了importScripts()办法,接管一个或多个指向JavaScript文件的URL,加载过程都是异步进行。 importScripts()只会在您提供相对URI的状况下失效,执行过程也是异步的。 当咱们创立WebWorkers对象后,它会持续监听音讯(即便在内部脚本实现之后)直到其被终止为止,应用myWorker.terminate()办法能够终止WebWorkers,并开释浏览器/计算机资源。 重要限度无法访问DOM节点,无法访问全局变量或是全局函数,无奈调用alert()或者confirm之类的函数和无法访问window、document之类的浏览器全局变量; 不过Web Worker中的Javascript仍然能够应用setTimeout(),setInterval()之类的函数,也能够应用XMLHttpRequest对象来做Ajax通信。

January 13, 2023 · 1 min · jiezi