前言
提到 WebWorker,可能有些小伙伴比较陌生,不知道是做什么的,甚至不知道使用场景,今天这篇文章就带大家一起简单了解一下什么是 webworker!
概念
WebWorker 实际上是运行在浏览器后台的一个单独的线程,因此可以执行一些耗时的操作而不会阻塞主线程。WebWorker 通过与主线程之间传递消息实现通信,这种通信是双向的。WebWorker不能直接访问 DOM,也不能使用像 window 对象这样的浏览器接口对象,但可以使用一些WebWorker 标准接口和 Navigator 对象的部分属性和方法。
为什么使用WebWorker?
- 提高应用响应能力:主线程被独占执行一些耗时的计算或操作时,会导致UI无响应。WebWorker 可以把这些任务转移到后台线程,从而保证主线程的运行,提高应用的响应能力。
- 充分利用多核CPU:现代CPU都是多核的,WebWorker 可以让 Web 应用利用多核 CPU 的并行计算能力,充分发挥计算机硬件性能。
- 避免渲染阻塞:JavaScript 运行在主线程,如果主线程一直占用,就无法执行 GUI 渲染任务,导致界面渲染受阻。WebWorker 把一些费时任务分流到后台线程就可以避免这一问题。
- 后台持续运行:WebWorker 所在后台线程可持续运行,即使页面被挂起或最小化,任务仍在后台执行,非常适合一些需要长时间运行的操作。
使用场景
一般来说,当遇到如下几种情况时可以考虑使用 WebWorker: