使用 web workers 提高 web 应用程序可用性

使用 web workers 提高 web 应用程序可用性

ID:34519969

大小:183.20 KB

页数:9页

时间:2019-03-07

使用 web workers 提高 web 应用程序可用性_第1页
使用 web workers 提高 web 应用程序可用性_第2页
使用 web workers 提高 web 应用程序可用性_第3页
使用 web workers 提高 web 应用程序可用性_第4页
使用 web workers 提高 web 应用程序可用性_第5页
资源描述:

《使用 web workers 提高 web 应用程序可用性》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库

1、页码,1/9使用WebWorkers提高web应用程序可用性Wei(Marshall)Shi,软件开发人员,IBMBoWang,软件工程师,IBM简介:WebWorkers,一个新的JavaScript编程模型,可以提高您web应用程序的交互性。有了它您就可以以一种多线程方法运行JavaScript,而且可以在后台运行脚本而不依赖任何用户界面脚本。本文介绍了WebWorkers,并引导您了解一个实践示例,向您展示如何将WebWorkers运用到您的web应用程序中。标记本文!发布日期:2011年11月02日级别:中级原创语言:英文简介随着Ajax和Web2.0应用程序的出现,终端用户被快速响应

2、的web应用程序宠坏了。要让web应用程序响应得更快,瓶颈一定要解决。瓶颈包括JavaScript和后台I/O庞大的计算量,这需要从主UI显示流程中移除,交给WebWorkers处理。WebWorkers规范提供不依赖任何用户界面脚本在后台运行脚本的能力。长期运行脚本不会被响应单击或其他用户交互的脚本中断。WebWorkers允许执行长期任务,同时也不影响页面响应。WebWorkers出现之前,JavaScript是现代web应用程序的核心。JavaScript和DOM本质上都是单线程的:在任何时间都只能执行一个JavaScript方法。即使您的计算机有4个内核,在进行长期计算时,也只有一个内

3、核比较繁忙。例如,您在计算到达月球的最佳轨道时,您的浏览器不能渲染一个显示轨迹的动画,以及—同时—对用户事件作出响应(比如鼠标单击或键盘输入)。原来的HTML5中,WebWorkersAPI被分离出去成为独立的规范。一些浏览器,比如Firefox3.5、Chrome3和Safari4可以实现大部分WebWorkersAPI。单击这里,查看如何使您的浏览器更好地支持WebWorkers。WebWorkers打破了传统JavaScript的单线程模式,引入了多线程编程模式。一个worker是一个独立的线程。有多个任务需要处理的web应用程序不再需要逐个处理任务。反之,应用程序可以将任务分配给不同的

4、workers。在本文中,您将学习WebWorkersAPI。一个实例引导您逐步使用WebWorkers来构建一个web页面。从下面的下载表格下载本文示例的源代码。回页首基本概念WebWorkers的基本组成:Worker一个新线程,在后台运行,不会阻塞任何主用户界面脚本(作为后台脚本被调用)。Workers是相对重量级的,不要大规模使用。一个worker可以执行不少任务,包括并行计算、后台I/O、以及客户端数据库操作。worker不应该页码,2/9中断主UI或直接操作DOM;它应该向主线程返回一个消息,并让主线程更新主UI。Subworker在一个worker中创建的worker。Subwo

5、rkers必须与父页面同根同源。subworkers的URI是根据父worker的地址而不是自己页面地址确定的。Sharedworker一个可以被多个页面通过多个连接所使用的worker,共享worker和普通worker的工作方式略有不同,只有一小部分浏览器支持这一特性。回页首WebWorkersAPI本小节介绍WebWorkersAPI的基本概念.创建一个worker要创建一个新worker,您只需要调用worker构造函数,worker脚本URL是惟一参数。worker创建完成的同时启动一个新线程(或者可能是一个新进程,根据您浏览的实现而定)。worker完成工作或者遇到一个错误时,您可

6、以使用作业实例的onmessage和onerror属性从worker获取通知。清单1是一个样例worker。清单1.样例workermyWorker.js//receiveamessagefromthemainJavaScriptthreadonmessage=function(event){//dosomethinginthisworkervarinfo=event.data;postMessage(info+“fromworker!”);};如果您运行清单2中的JavaScript代码,您将得到“HelloWorldfromworker”。清单2.主JavaScript线程中的Worker

7、//createanewworkervarmyWorker=newWorker("myWorker.js");//sendamessagetostarttheworkervarinfo=“HelloWorld”;myWorker.postMessage(info);//receiveamessagefromtheworkermyWorker.onmessage=function(event){//

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。