Open baixiaoji opened 5 years ago
JavaScript 是单线程语言，也就意味一次性只能做一件事情。一旦遇到计算密集型或高延迟的任务，在结果出来之前整个UI 层对操作会没有任何反应，这是 UI 线程假死现象。
在这背景下，为了让页面有更好的体验， W3C 在 HTML5 的规范中提出了 Web Worker的概念，允许浏览器通过后台线程来执行复杂的事物或者逻辑。
随着电脑计算能力的增强，尤其是多核 CPU 的出现，由于 JavaScript 是单线程语言的特性，无法充分发挥电脑的计算能力。
而 Web Worker 的出现，给 JavaScript 创建了多线程的机会。主线程可以创建 Worker 线程，将一些任务分配给创建的 Worker 线程运行，此时并不会影响主线程的运行，直到 Worker 线程完成任务，再将结果返回给主线程。
这样好处是，会造成 UI 线程假死现象的任务被 Worker 线程负担了，主线程就会很流畅。
Worker 线程一旦新建成功，就会始终运行，不会被主线程上的活动（比如用户点击按钮、提交表单）打断。这样有利于随时响应主线程的通信。但是，这也造成了 Worker 比较耗费资源，不应该过度使用，而且一旦使用完毕，就应该关闭。
专用 Worker （Dedicated Worker）：自身页面后台帮助运算的加强器。
共享 Worker（Shared Worker）：多个页面后台帮助匀速和共享数据的加强器。
A dedicated worker is only accessible by the script that called it.
A shared worker is accessible by multiple scripts — even if they are being accessed by different windows, iframes, or even workers.
专用 Worker 只能被创建的脚本访问，但是共享 Worker 可以被来源不同的脚本共同访问。
我自己的理解是：前者理解为自身tab的一个后台处理器，加强部分功能，多数是高计算的功能，后者理解为多个tab的一个后台处理器。
document
window
parent
navigator
location
alert()
confirm()
XMLHttpRequest
AJAX
file://my/file/on/my/computer
下文直接讲述实操部分，敬请期待。
注：本系列文章涉及Web Worker 只包含 Dedicated Worker 以及 Shared Worker。
哇~到底什么是：Web Worker ？
Web Worker 诞生
JavaScript 是单线程语言，也就意味一次性只能做一件事情。一旦遇到计算密集型或高延迟的任务，在结果出来之前整个UI 层对操作会没有任何反应，这是 UI 线程假死现象。
在这背景下，为了让页面有更好的体验， W3C 在 HTML5 的规范中提出了 Web Worker的概念，允许浏览器通过后台线程来执行复杂的事物或者逻辑。
随着电脑计算能力的增强，尤其是多核 CPU 的出现，由于 JavaScript 是单线程语言的特性，无法充分发挥电脑的计算能力。
而 Web Worker 的出现，给 JavaScript 创建了多线程的机会。主线程可以创建 Worker 线程，将一些任务分配给创建的 Worker 线程运行，此时并不会影响主线程的运行，直到 Worker 线程完成任务，再将结果返回给主线程。
这样好处是，会造成 UI 线程假死现象的任务被 Worker 线程负担了，主线程就会很流畅。
Worker 线程一旦新建成功，就会始终运行，不会被主线程上的活动（比如用户点击按钮、提交表单）打断。这样有利于随时响应主线程的通信。但是，这也造成了 Worker 比较耗费资源，不应该过度使用，而且一旦使用完毕，就应该关闭。
Web Worker 族谱
专用 Worker （Dedicated Worker）：自身页面后台帮助运算的加强器。
共享 Worker（Shared Worker）：多个页面后台帮助匀速和共享数据的加强器。
Dedicated Worker V.S Shared Worker
A dedicated worker is only accessible by the script that called it.
A shared worker is accessible by multiple scripts — even if they are being accessed by different windows, iframes, or even workers.
专用 Worker 只能被创建的脚本访问，但是共享 Worker 可以被来源不同的脚本共同访问。
我自己的理解是：前者理解为自身tab的一个后台处理器，加强部分功能，多数是高计算的功能，后者理解为多个tab的一个后台处理器。
Web Worker 注意项
document、window、parent这些对象。但是，Worker 线程中有navigator和location对象。alert()和confirm()方法，但可以使用XMLHttpRequest对象发送AJAX请求。file://my/file/on/my/computer。下文直接讲述实操部分，敬请期待。
注：本系列文章涉及Web Worker 只包含 Dedicated Worker 以及 Shared Worker。