useWebWorkerFn

v0.0.14testeddemo

Run an expensive function in a transient Web Worker off the main thread

Examples

const { workerFn, workerStatus } = useWebWorkerFn((n: number) => {
  let sum = 0;
  for (let i = 0; i < n; i++) sum += i;
  return sum;
});
const total = await workerFn(1e9);

const { workerFn } = useWebWorkerFn(dates => dayjs(dates[0]).isBefore(dates[1]), {
  dependencies: ['https://cdn.jsdelivr.net/npm/dayjs@1/dayjs.min.js'],
  timeout: 5000,
});

Demo

Loading demo…

Signature

export function useWebWorkerFn<T extends AnyFunction>(
  fn: T,
  options: UseWebWorkerFnOptions ={ ... }

Type Parameters

Textends AnyFunction

Parameters

Parameter	Type	Default	Description
`fn`	`T`	—	The function to execute inside the worker (must be self-contained or rely on `dependencies`/`localDependencies`)
`options`?	`UseWebWorkerFnOptions`	`{}`	Worker dependencies, timeout and error hook

Returns

UseWebWorkerFnReturn<T>{ workerFn, workerStatus, workerTerminate, isSupported }

Property	Type	Default	Description
`workerFn`	`(...args: Parameters<T>) => Promise<ReturnType<T>>`	—	Run `fn` in a transient worker. Resolves with its return value, rejects on error or timeout. Only one run may be active at a time.
`workerStatus`	`ShallowRef<WebWorkerStatus>`	—	Reactive status of the current worker run.
`workerTerminate`	`(status?: WebWorkerStatus) => void`	—	Terminate the active worker and reset to the given status.
`isSupported`	`ShallowRef<boolean>`	—	Whether `Worker`, `Blob` and `URL.createObjectURL` are available (SSR-safe).