Web Worker处在一个自包含的执行环境中,无法访问Window对象和Document对象,和主线程之间的通信也只能通过异步消息传递机制来实现。
Web Worker提供了一种使用异步API的方式,允许书写需要长时间运行的函数而不会带来循环事件和导致浏览器崩溃的问题。
Worker对象
要创建一个新的worker,只需使用Worker()构造函数,并将指定在Worker中运行的JavaScript脚本的URL传递给该构造函数即可:
var loader = new Worker('utils/loader.js');
如果URL是相对路径,则以包含调用Worker()构造函数脚本的文档的URL为参照;如果URL是绝对路径,则必须和包含该脚本的文档是同源的(同样的协议、主机名和端口)。
一旦获取到Worker对象后,就可以通过postMessage()方法来传递参数了。
可以通过监听worker对象上的message事件来接收来自worker的消息:
worker.onmessage = function(e){ var message = e.data; console.log(message); }
当worker抛出了异常,并且它自己没有对其进行捕获和处理,则可以作为监听的一个error事件来传递该异常:
worker.onerror = function(e) { console.log("Error at " + e.filename + ": " + e.lineno + ": " + e.message); }
和所有的事件目标一样,worker对象也定义了标准的addEventListener()方法和removeEventListener()方法,如果要管理多个事件处理程序,则可以使用这些方法来代替onmessage和onerror。
worker对象还有另一个方法:terminate()。该方法强制一个worker线程结束运行。
在worker代码中可以使用importScripts()方法加载需要的其他代码。
importScripts()方法接受一个或多个URL参数,每个URL都需指向一个JavaScript代码文件。
相关推荐
HTML5 Web Worker是Web开发中的一个关键特性,它允许在后台线程中执行脚本,以提高网页的响应速度和处理能力。Web Worker使得复杂的、计算密集型的任务可以在不阻塞用户界面的情况下运行,显著提升了Web应用的性能...
1. **Web Worker**:Web Worker是HTML5引入的一种技术,允许在后台线程中运行脚本,这样可以长时间运行的任务不会影响用户界面的响应性。主线程负责处理UI交互,而Worker线程则用于处理计算密集型任务。 2. **Face-...
"使用HTML5 Web Worker提高Web应用性能研究" HTML5 Web Worker是HTML5提供的一种JavaScript多...10. Web Worker的未来发展方向:随着HTML5的发展,Web Worker将会更加普及和强大,成为Web应用性能优化的重要手段之一。
Web Worker是HTML5引入的一个特性,用于在后台线程中执行脚本,以实现多线程处理,避免阻塞主线程。由于Web Worker的特殊性,其加载和运行机制与常规的JavaScript代码不同,因此需要特别处理。 为了在Webpack中添加...
**H5 Web Worker** 是HTML5中引入的一个重要特性,旨在解决现代Web应用程序中的多线程问题。在传统的Web开发中,JavaScript是单线程执行的,这意味着所有任务都在同一个线程上运行,如果遇到复杂的计算或者长时间的...
除了Web Worker,HTML5还引入了另一个与之相关的API——FileSystem API,它提供了在浏览器中读写文件系统的功能,这在某些场景下与Web Worker配合使用可以实现更强大的离线应用。然而,FileSystem API由于安全和隐私...
Web Worker是HTML5的一个特性,它允许在浏览器后台独立于主线程执行脚本,避免了长时间运行的脚本导致的网页无响应问题。Web Worker在后台线程中运行,可以长时间进行大量计算,同时不会影响用户的交互。Worker线程...
在"Html5+WebWorkers定时通讯心跳处理"的场景中,我们首先需要创建一个Web Worker脚本,这个脚本通常会包含心跳消息的发送逻辑。例如,worker.js可能包含以下代码: ```javascript self.addEventListener('message'...
【温故而知新】HTML5的Web Worker
Web Worker是HTML5引入的一个特性,它允许在浏览器的后台线程中执行脚本,以进行计算密集型或长时间运行的任务,而不影响用户界面的响应速度。在图像加载场景中,由于图片数据量大,直接在主线程加载会使得页面变得...
HTML5的Web Worker是JavaScript实现多线程的一种技术,它允许开发者在后台线程中运行耗时的操作,而不会影响用户界面的响应性。Web Worker的主要目标是解决JavaScript的单线程执行问题,使得复杂的计算或者大数据...
为了解决这个问题,HTML5引入了Web Workers API,它允许在后台线程中执行脚本,从而不阻塞主线程。但Web Workers不能直接访问DOM,这限制了其在处理DOM操作时的应用。`Via.js`,正如标题所言,是一个创新性的库,它...
HTML5中的Web Workers是Web应用程序的一个重要特性,它允许在后台线程中执行脚本,以实现长时间运行的计算任务,而不会阻塞主线程,从而保持用户界面的响应性。这一特性对于处理大量数据、复杂的计算或者实时更新的...
HTML5 中的 Web Worker 可以分为两种不同线程类型,一个是专用线程 Dedicated Worker,一个是共享线程 Shared Worker。两种类型的线程各有不同的用途,感兴趣的朋友可以了解下啊,或许对你有所帮助
画布WebWorker 可以在WebWorkers中使用的纯JavaScript Canvas实现 当必须执行长脚本而主程序必须保持运行(不能被阻止)时,WebWorkers非常有用。 当必须生成复杂的图像(例如,游戏的纹理较大)时,该生成可能会...
HTML5的Web线程,全称为Web Workers,是HTML5引入的一个强大特性,旨在提高Web应用程序的性能和响应性。Web Workers允许在浏览器后台独立于主线程运行脚本,处理大量计算任务,避免了因为JavaScript执行阻塞而导致的...
这个名为"基于各种HTML5新特性、WebSocket、WebWorker实现的视频播放弹幕互动网页.zip"的压缩包文件,显然是一个利用HTML5技术来构建的多媒体互动项目,特别关注了视频播放和实时弹幕功能。 首先,让我们详细了解...
HTML5移动Web开发是当前互联网应用开发的重要领域,随着移动设备的普及,越来越多的开发者将目光转向了构建适应各种屏幕尺寸、操作系统且具有良好用户体验的移动Web应用。本资源提供了“HTML5移动Web开发”指南,...