H5 Web Workers

Web Workers 是 HTML5 提供的一个 JavaScript 多线程解决方案。我们可以将大计算的代码交给 Web worker 运行而不冻结用户界面。但是子线程完全受主线程控制,且不能操作 DOM ,所以这个标准并没有改变 JavaScript 单线程的本质。

1
2
3
4
5
6
7
8
var myWorker = new Worker('worker.js');
var first = document.querySelector('#number1');
var second = document.querySelector('#number2');

first.onchange = function() {
myWorker.postMessage([first.value,second.value]);
console.log('Message posted to worker');
}

Web Workers 存在的问题

  1. 不能跨域加载JS
  2. Worker内代码不能访问DOM(更新UI),因为worker线程内不存在 window 全局对象。
  3. 浏览器可能不支持该特性。

参考

  1. https://developer.mozilla.org/zh-CN/docs/Web/API/Worker