Skip to content

Web Workers in Angular

Web Workers offload heavy computation from main thread.

Generate worker:

Terminal window
ng generate web-worker compute

Example in TypeScript:

// compute.worker.ts
addEventListener('message', ({ data }) => {
const result = data \* 2;
postMessage(result);
});
``

Usage in component:

const worker = new Worker(new URL("./compute.worker", import.meta.url));
worker.postMessage(10);
worker.onmessage = ({ data }) => console.log(data);