Bridge 个人博客

Web Worker

2022/9/21

# 概述

JavaScript 是单线程执行的，所有任务只能放在一个线程上执行，这就限制了多核计算机充分发挥计算能力；同时，JS的执行通常位于主线程，和页面绘制、样式计算等处于同一线程，因此不免会出现阻塞其他任务的情况，而导致用户体验不佳。

因此我们可以使用 Web Worker，Web Worker 为 JS 的执行提供了多线程环境，主线程可通过创建 Worker 子线程，从而分担任务执行的压力。

Worker 子线程不会影响主线程的执行，同时一旦创建成功就会立刻执行，不会被主线程的事件打断，所以比较耗费资源，必须合理使用且执行完毕后及时关闭

# 限制

  • DOM 限制
    Worker 无法读取主线程所处理的网页的 DOM 对象，也无法使用 document、window、parent 等对象，只能访问 navigator、location 对象

  • 文件读取限制
    Worker 子线程读取的脚本必须从网络获取，不能从本地文件加载

  • 通信限制
    Worker 子线程无法直接和主线程进行通信，必须通过消息完成

  • 脚本执行限制
    Worker 子线程可以通过 XMLHTTPRequest 对象发起 ajax 请求，但是不能使用 alert()、confirm() 方法在页面弹出提示

  • 同源限制
    Worker 子线程执行的代码文件必须和主线程的代码文件同源

阮一峰-Web Worker教程 (opens new window)

CSS