esbuild-plugin-webworker

🍣 An ESbuild plugin to handler webworker.

Requirements

This plugin requires an LTS Node version (v14.0.0+) and ESbuild v0.18.0+.

Install

Using pnpm:

pnpm add esbuild-plugin-webworker -D

Usage

ESbuild Config

import { build } from "esbuild";
import webworker from "esbuild-plugin-webworker";

build({
  /* ... */
  plugins: [worker()],
});

Worker Code

// fib_worker.ts
self.onmessage = (e) => {
  const userNum = Number(e.data);
  const result = fib(userNum);

  self.postMessage(result);
};

function fib(n: number): number {
  if (n === 0) {
    return 0;
  }
  if (n === 1 || n === 2) {
    return 1;
  }

  return fib(n - 1) + fib(n - 2);
}

Main Code

// main.ts
import createWorker from "./fib_worker?worker";

const worker = createWorker();

function fibonacciInWorker(n: number): Promise<number> {
  const promise = new Promise<number>((resolve) => {
    worker.onmessage = (event) => {
      resolve(event.data);
    };
  });

  worker.postMessage(n);

  return promise;
}

export { fibonacciInWorker };

Options

inline

Type: boolean Default: true

If false, will output worker file, default at dist.

out

Type: string Default: dist

Output path of worker file. Take effect when inline is false.

filter

Type: RegExp Default: /\?worker$/

The RegExp to match worker file.

minify

Type: boolean Default: true

Whether to minify worker code.

keepImportName

Type: boolean Default: false

Whether to remove the mark of web worker file.