一. Web Worker 是干什么的?
web worker 是运行在后台的 JavaScript,独立于其他脚本,不会影响页面的性能。您可以继续做任何愿意做的事情:点击、选取内容等等,而此时 web worker 在后台运行。(是不是很通俗易懂✌✌)
二. 它的使用场景
- 长周期的定时任务(例如:每天00:00 执行一次api请求)
- 可以用于执行一些耗时的计算、网络请求、数据处理等任务,提高应用的性能和响应速度。
- 大文件上传(大文件大家都知道是非常耗时的,可放在Worker 线程在后台运行)
三. 为什么不用定时器(setTimeout、setInterval)
大家都知道定时器都是耗性能的,用不好可能会存在很多副作用。有时候定时器好像并没有按照我们的预期去执行,比如我们常遇到的setTimeout(()=>{},0)它有时候并不是按我们预期的立马就执行。定时器有延迟执行时间有最大值,(delay)大于 2147483647 毫秒 (大约24.8 天)时就会溢出,导致定时器将会被立即执行(官方说明)
setTimeout 的第二个参数设置为 0 (未设置、小于 0、大于 2147483647 时都默认为 0)的时候,意味着马上执行,或者尽快执行。
说了这么多总结一下子,setTimeout delay 有限制,setInterval 做轮询是可以的,但放在主线程并不是好的方案
四. “一个字干”,咱上代码
const new_worker = new Worker("workers.js");
new_worker.onmessage = function (event) {
console.log('打印接收的值',event.data);
};
workers.js 代码
var i=0;
function timedCount()
{
i=i+1;
postMessage(i);
setTimeout("timedCount()",500);
}
timedCount();
new_worker.terminate(); //立即终止线程
github: github.com/Bun800/web-…
五. 总结
Web Worker 的作用就是为 JavaScript 创造多线程环境 , 在项目中时间周期较短的定时任务可以使用定时器poll,较长的周期显然用定时器就不是很好的解决方案。Web Worker 的出现可以在不影响主线程的情况下,去做一些后台任务。Web Worker 就讲到这里了。