使用使用WebWorkers提高提高web应用程序可用性应用程序可用性
Web Workers，一个新的 JavaScript 编程模型，可以提高您 web 应用程序的交互性。有了它您就可以以一种多线程方
法运行 JavaScript，而且可以在后台运行脚本而不依赖任何用户界面脚本。本文介绍了 Web Workers，并引导您了解
一个实践示例，向您展示如何将 Web Workers 运用到您的 web 应用程序中。
简介
随着 Ajax 和 Web 2.0 应用程序的出现，终端用户被快速响应的 web 应用程序宠坏了。要让 web 应用程序响应得更
快，瓶颈一定要解决。瓶颈包括 JavaScript 和后台 I/O 庞大的计算量，这需要从主 UI 显示流程中移除，交给 Web
Workers 处理。
Web Workers 规范提供不依赖任何用户界面脚本在后台运行脚本的能力。长期运行脚本不会被响应单击或其他用户交
互的脚本中断。Web Workers 允许执行长期任务，同时也不影响页面响应。
Web Workers 出现之前，JavaScript 是现代 web 应用程序的核心。JavaScript 和 DOM 本质上都是单线程的：在任何
时间都只能执行一个 JavaScript 方法。即使您的计算机有 4 个内核，在进行长期计算时，也只有一个内核比较繁忙。
例如，您在计算到达月球的最佳轨道时，您的浏览器不能渲染一个显示轨迹的动画，以及 — 同时 — 对用户事件作出
响应（比如鼠标单击或键盘输入）。
Web Workers 打破了传统 JavaScript 的单线程模式，引入了多线程编程模式。一个 worker 是一个独立的线程。有多
个任务需要处理的 web 应用程序不再需要逐个处理任务。反之，应用程序可以将任务分配给不同的 workers。
在本文中，您将学习 Web Workers API。一个实例引导您逐步使用 Web Workers 来构建一个 web 页面。
从下面的 下载表格 下载本文示例的源代码。
基本概念
Web Workers 的基本组成：
Worker
一个新线程，在后台运行，不会阻塞任何主用户界面脚本（作为后台脚本被调用）。Workers 是相对重量级的，不要
大规模使用。
一个 worker 可以执行不少任务，包括并行计算、后台 I/O、以及客户端数据库操作。worker 不应该中断主 UI 或直接
操作 DOM；它应该向主线程返回一个消息，并让主线程更新主 UI。
Subworker
在一个 worker 中创建的 worker。Subworkers 必须与父页面同根同源。subworkers 的 URI 是根据父 worker 的地址而
不是自己页面地址确定的。
Shared worker
一个可以被多个页面通过多个连接所使用的 worker，共享 worker 和普通 worker 的工作方式略有不同，只有一小部分
浏览器支持这一特性。
Web Workers API
本小节介绍 Web Workers API 的基本概念.
创建一个 worker
要创建一个新 worker，您只需要调用 worker 构造函数，worker 脚本 URL 是惟一参数。worker 创建完成的同时启动一
个新线程（或者可能是一个新进程，根据您浏览的实现而定）。
worker 完成工作或者遇到一个错误时，您可以使用作业实例的 onmessage 和 onerror 属性从 worker 获取通知。清单
1 是一个样例 worker。
清单 1. 样例 worker myWorker.js
// receive a message from the main JavaScript thread
onmessage = function(event) {
// do something in this worker
var info = event.data;
postMessage(info + “ from worker!”);
};
如果您运行清单 2 中的 JavaScript 代码，您将得到 “Hello World from worker” 。
剩余11页未读，继续阅读
资源评论
