1---
2category: Browser
3related: useWebWorkerFn
4---
5 
6# useWebWorker
7 
8Simple [Web Workers](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers) registration and communication.
9 
10## Usage
11 
12```ts
13import { useWebWorker } from '@vueuse/core'
14 
15const { data, post, terminate, worker } = useWebWorker('/path/to/worker.js')
16```
17 
18| State  | Type                              | Description                                                                                          |
19| ------ | --------------------------------- | ---------------------------------------------------------------------------------------------------- |
20| data   | `Ref<any>`                        | Reference to the latest data received via the worker, can be watched to respond to incoming messages |
21| worker | `ShallowRef<Worker \| undefined>` | Reference to the instance of the WebWorker                                                           |
22 
23| Method    | Signature                                                                                                                     | Description                      |
24| --------- | ----------------------------------------------------------------------------------------------------------------------------- | -------------------------------- |
25| post      | `(message: any, transfer: Transferable[]): void`<br>`(message: any, options?: StructuredSerializeOptions \| undefined): void` | Sends data to the worker thread. |
26| terminate | `() => void`                                                                                                                  | Stops and terminates the worker. |
27 
28## Type Declarations
29 
30```ts
31type PostMessage = (typeof Worker.prototype)["postMessage"]
32export interface UseWebWorkerReturn<Data = any> {
33  data: Ref<Data>
34  post: PostMessage
35  terminate: () => void
36  worker: ShallowRef<Worker | undefined>
37}
38type WorkerFn = (...args: unknown[]) => Worker
39/**
40 * Simple Web Workers registration and communication.
41 *
42 * @see https://vueuse.org/useWebWorker
43 * @param url
44 * @param workerOptions
45 * @param options
46 */
47export declare function useWebWorker<T = any>(
48  url: string,
49  workerOptions?: WorkerOptions,
50  options?: ConfigurableWindow,
51): UseWebWorkerReturn<T>
52/**
53 * Simple Web Workers registration and communication.
54 *
55 * @see https://vueuse.org/useWebWorker
56 */
57export declare function useWebWorker<T = any>(
58  worker: Worker | WorkerFn,
59): UseWebWorkerReturn<T>
60```
61