简介
vacuumlabs-threading 是一个 npm 包，它提供了一种简单易用的方式来在浏览器中执行并行任务。它支持多种并发模式，并提供了一些有用的工具，例如线程的调度和结果的聚合。
安装
你可以使用 npm 或者 yarn 来安装 vacuumlabs-threading：
npm install vacuumlabs-threading
或者
yarn add vacuumlabs-threading
基础用法
创建 worker
-- -------------------- ---- -------
------ - ------------ - ---- -----------------------
----- ------ - --------------
-------------------------------- ------- -- -
----- ---- - -----------
----- ------ - -------------------------
-------------------------
---
---createWorker 函数接收一个字符串参数，其中包含了 worker 中要执行的 JavaScript 代码。代码中需要自己处理 message 事件，并将计算结果使用 postMessage 方法返回给主线程。
发送消息
worker.postMessage(someData);
向 worker 发送消息的方式与向普通的浏览器线程发送消息是一样的。
接收消息
worker.addEventListener('message', (event) => {
const data = event.data;
console.log(data);
});worker 的返回结果通过监听 message 事件来获取。
终止 worker
worker.terminate();
在使用完 worker 后，需要手动终止它以释放资源。
高级用法
并发模式
默认情况下，vacuumlabs-threading 使用的是共享 worker。这意味着，在创建 worker 时，它会在所有调用 createWorker 函数的地方共享同一个 worker 线程。
如果你想要向 worker 中传递复杂的数据类型（例如，ArrayBuffer、SharedArrayBuffer、ImageData 等），或者需要在 worker 中加载外部资源（例如，使用 $http 模块加载 JSON 数据），那么共享 worker 就无法满足你的需求了。
在这种情况下，你可以使用"专属 worker"或"虚拟 worker"。
专属 worker：每次调用
createWorker函数时，都会创建一个新的 worker 线程。这种模式适用于需要处理大量数据或者需要在 worker 中加载外部资源的情况。const worker1 = createWorker(` // Worker 1 `); const worker2 = createWorker(` // Worker 2 `);
虚拟 worker：在同一个页面中模拟多线程执行。这种模式适用于一些简单的并行操作，例如对一个数组中的所有元素进行处理。
import { VirtualWorker } from 'vacuumlabs-threading'; const worker1 = new VirtualWorker(); const worker2 = new VirtualWorker();
线程调度
在使用一些并发模式（例如内部 worker）时，线程调度变得尤为重要。为了更好地控制线程的执行顺序，vacuumlabs-threading 提供了一些有用的工具。
构建任务队列
-- -------------------- ---- ------- ------ - ----------- - ---- ----------------------- ----- ----- - -------------- ------------ -- - -- ---- - --- ------------ -- - -- ---- - --- ------------
通过任务队列，你可以确保在所有任务结束之前不会开始新的任务。
并发线程
-- -------------------- ---- ------- ------ - ---------- - ---- ----------------------- ----- ---- - -------------- -- -- - ------- ----------- -- - -- ------ - --- ----------- -- - -- ------ - --- -----------
通过并发线程，你可以并行执行多个 worker，以最大限度地利用 CPU 的能力。
结果聚合
在使用多个 worker 同时处理数据时，有时需要对处理的结果进行聚合。为了解决这个问题，vacuumlabs-threading 提供了 Promise.all 的替代方案，即 Promise.allSettledWithProgress。
-- -------------------- ---- ------- ------ - ----------- ----------------- - ---- ----------------------- ----- ---- - -------------- ----- -------- - ----------- -- - ------ -------------------- --- ----- -------- - ----------- -- - ------ -------------------- --- ----- -------- - ----------- -- - ------ -------------------- --- ---------------------------- --------- ------------------------- -- - --------------------- ---
PromiseAllSettled 函数接收一个 Promise 数组，它会对所有 Promise 对象并行执行，并返回一个结果数组，其中包含了它们的状态信息。它与 Promise.allSettled 类似，但是在处理被拒绝的 Promise 时，它将返回一个代表错误信息的对象，而不是抛出错误。
示例代码
使用共享 Worker
-- -------------------- ---- -------
------ - ------------- ----------------- - ---- -----------------------
----- ------- - --------------
-------------------------------- ------- -- -
----- ---- - -----------
----- ------ - -------------------------
-------------------------
---
---
----- ------- - --------------
-------------------------------- ------- -- -
----- ---- - -----------
----- ------ - -------------------------
-------------------------
---
---
----- ------- - --------------
-------------------------------- ------- -- -
----- ---- - -----------
----- ------ - -------------------------
-------------------------
---
---
----- -------- - --------------------- --------- --- -------- ---
----- -------- - --------------------- --------- --- -------- ---
----- -------- - --------------------- --------- --- -------- ---
---------------------------- --------- ------------------------- -- -
---------------------
-- -
-- - ------- ------------ ------ ------- ---- -------- --
-- - ------- ------------ ------ ------- ---- -------- --
-- - ------- ------------ ------ ------- ---- -------- -
-- -
---
-------- ------------------------ -
-- -----
------ ------- ---- --------
-使用虚拟 Worker
-- -------------------- ---- ------- ------ - -------------- ----------------- - ---- ----------------------- ----- ------- - --- ---------------- ----- ------- - --- ---------------- ----- ------- - --- ---------------- ----- -------- - --------------------- --------- --- -------- --- ----- -------- - --------------------- --------- --- -------- --- ----- -------- - --------------------- --------- --- -------- --- ---------------------------- --------- ------------------------- -- - --------------------- -- - -- - ------- ------------ ------ ------- ---- -------- -- -- - ------- ------------ ------ ------- ---- -------- -- -- - ------- ------------ ------ ------- ---- -------- - -- - --- -------- ------------------------ - -- ----- ------ ------- ---- -------- -
使用任务队列
-- -------------------- ---- ------- ------ - ----------- - ---- ----------------------- ----- ----- - -------------- ------------ -- - -- ---- - --- ------------ -- - -- ---- - --- ------------
使用并发线程
-- -------------------- ---- ------- ------ - ---------- - ---- ----------------------- ----- ---- - -------------- -- ------ - --- ----------- -- - -- ------ - --- ----------- -- - -- ------ - --- -----------
总结
vacuumlabs-threading 是一个非常实用的 npm 包，它提供了一种简单易用的方式来在浏览器中执行并行任务。它支持多种并发模式，并提供了一些有用的工具，例如线程的调度和结果的聚合。希望这篇文章对你有帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005694781e8991b448e4c7d