### WorkerGlobalScope.postMessage() for Sending Messages from Worker

Source: https://context7.com/developit/web-worker/llms.txt

Shows how to use `postMessage` within a worker thread to send data back to the main thread. This example implements a simple calculator worker that performs addition or multiplication based on received messages.

```javascript
// main.js
import Worker from 'web-worker';

const worker = new Worker(
  new URL('./calculator.js', import.meta.url),
  { type: 'module' }
);

worker.onmessage = (e) => {
  console.log('Calculation result:', e.data); // Output: Calculation result: 15
};

worker.postMessage({ operation: 'add', values: [5, 10] });
```

```javascript
// calculator.js
addEventListener('message', (e) => {
  const { operation, values } = e.data;

  let result;
  switch (operation) {
    case 'add':
      result = values.reduce((sum, val) => sum + val, 0);
      break;
    case 'multiply':
      result = values.reduce((prod, val) => prod * val, 1);
      break;
    default:
      result = null;
  }

  postMessage(result);
});
```

--------------------------------

### Module Workers with ES6 Imports (main.js & worker.mjs)

Source: https://context7.com/developit/web-worker/llms.txt

Demonstrates setting up and communicating with module workers that utilize ES6 import/export syntax. The main script initializes a module worker, sends a URL, and receives a response fetched by the worker.

```javascript
// main.js
import Worker from 'web-worker';

const worker = new Worker(
  new URL('./worker.mjs', import.meta.url),
  { type: 'module' }
);

worker.addEventListener('message', e => {
  console.log('Response:', e.data); // Output: Response: "200 OK"
});

worker.postMessage('https://httpstat.us/200');
```

```javascript
// worker.mjs
import fetch from 'isomorphic-fetch';

addEventListener('message', async e => {
  const url = e.data;
  const res = await fetch(url);
  const text = await res.text();
  postMessage(text);
});
```

--------------------------------

### Create New Worker Threads with web-worker

Source: https://context7.com/developit/web-worker/llms.txt

Demonstrates the creation of new worker threads using the Worker constructor. Supports basic Data URL workers, module workers with ES6 imports, and classic workers loaded from file paths. Initializes workers in a separate execution context.

```javascript
import Worker from 'web-worker';

// Basic data URL worker
const worker = new Worker('data:,postMessage("hello")');
worker.onmessage = e => console.log(e.data); // Output: "hello"

// Module worker with relative path
const moduleWorker = new Worker(
  new URL('./worker.js', import.meta.url),
  { type: 'module', name: 'myWorker' }
);

// Classic worker (default)
const classicWorker = new Worker('./classic-worker.js');
```

--------------------------------

### Create Inline Workers Using Data URLs

Source: https://context7.com/developit/web-worker/llms.txt

Demonstrates creating web workers with inline JavaScript code using data URLs, eliminating the need for separate worker files. Supports both simple inline code and module workers with imports. Inline code is URL-encoded to handle special characters and multiple statements.

```javascript
import Worker from 'web-worker';

// Simple inline worker
const simpleWorker = new Worker('data:application/javascript,postMessage(42)');
simpleWorker.onmessage = e => console.log(e.data); // Output: 42

// Module worker with imports
const moduleCode = `
  import { randomBytes } from 'crypto';
  postMessage(randomBytes(16).toString('hex'));
`;
const cryptoWorker = new Worker(
  `data:application/javascript,${encodeURIComponent(moduleCode)}`,
  { type: 'module' }
);
cryptoWorker.onmessage = e => console.log('Random:', e.data);

// Worker with event listener
const eventCode = `
  addEventListener('message', e => {
    const doubled = e.data.map(n => n * 2);
    postMessage(doubled);
  });
`;
const eventWorker = new Worker(
  `data:application/javascript,${encodeURIComponent(eventCode)}`
);
eventWorker.onmessage = e => console.log('Doubled:', e.data); // Output: Doubled: [2, 4, 6]
eventWorker.postMessage([1, 2, 3]);
```

--------------------------------

### Load External Scripts in Classic Workers Using importScripts()

Source: https://context7.com/developit/web-worker/llms.txt

Shows how to synchronously load and execute external scripts and inline scripts via data URLs in classic workers. The worker imports helper functions from external files and can combine them with inline scripts loaded as data URLs.

```javascript
import Worker from 'web-worker';

const worker = new Worker('./classic-worker.cjs');

worker.onmessage = (e) => {
  console.log('Messages:', e.data);
  // Output: Messages: ["from helper.js", "from inline script"]
};
```

```javascript
// Load external script files
importScripts('./helper.cjs');

// Load inline scripts via data URLs
importScripts('data:application/javascript,postMessage("from inline script")');

// Use functions from imported scripts
postMessage(helperFunction()); // helperFunction defined in helper.cjs
```

```javascript
function helperFunction() {
  return "from helper.js";
}
```

--------------------------------

### Import Worker from External Module File

Source: https://github.com/developit/web-worker/blob/main/README.md

Demonstrates the main thread creating a worker from an external JavaScript module using URL resolution with import.meta.url. The main thread sends a message to the worker and listens for responses using addEventListener. This pattern ensures proper module resolution relative to the current file.

```JavaScript
import Worker from 'web-worker';

const url = new URL('./worker.js', import.meta.url);
const worker = new Worker(url);

worker.addEventListener('message', e => {
  console.log(e.data)  // "hiya!"
});

worker.postMessage('hello');
```

--------------------------------

### Implement Async Module Worker with Fetch

Source: https://github.com/developit/web-worker/blob/main/README.md

Implements a worker using ES Modules that performs asynchronous operations. The worker receives a URL, fetches data using isomorphic-fetch, and sends the response text back to the main thread. Demonstrates async/await usage within a worker context.

```JavaScript
import fetch from 'isomorphic-fetch';

addEventListener('message', async e => {
  const url = e.data;
  const res = await fetch(url)
  const text = await res.text();
  postMessage(text);
});
```

--------------------------------

### Handle Worker Events with addEventListener and Property Handlers

Source: https://context7.com/developit/web-worker/llms.txt

Details how to listen for events emitted by a worker thread, such as 'message', 'error', and 'close'. Both `addEventListener` and direct property assignments (`onmessage`, `onerror`, `onclose`) are supported for flexible event handling.

```javascript
import Worker from 'web-worker';

const worker = new Worker('./worker.js', { type: 'module' });

// Method 1: Property-based handler
worker.onmessage = (event) => {
  console.log('Message from worker:', event.data);
};

worker.onerror = (error) => {
  console.error('Worker error:', error.message);
};

worker.onclose = () => {
  console.log('Worker closed');
};

// Method 2: addEventListener
worker.addEventListener('message', (event) => {
  console.log('Received:', event.data);
});

worker.addEventListener('error', (error) => {
  console.error('Error occurred:', error);
});

worker.addEventListener('close', () => {
  console.log('Worker exited');
});

worker.postMessage('start');
```

--------------------------------

### Create Module Worker with Type Configuration

Source: https://github.com/developit/web-worker/blob/main/README.md

Creates an ES Module-based worker by specifying {type: 'module'} option in the Worker constructor. Supports Node 12.8+ and modern browsers. The worker can import dependencies like isomorphic-fetch and use async/await for asynchronous operations.

```JavaScript
import Worker from 'web-worker';

const worker = new Worker(
  new URL('./worker.mjs', import.meta.url),
  { type: 'module' }
);
worker.addEventListener('message', e => {
  console.log(e.data)  // "200 OK"
});
worker.postMessage('https://httpstat.us/200');
```

--------------------------------

### Create Worker from Data URL with Inline Code

Source: https://github.com/developit/web-worker/blob/main/README.md

Instantiates a worker using a data URL containing inline JavaScript code. The worker immediately posts a numeric value (42) which is received and logged by the main thread. Supports both classic and module worker patterns.

```JavaScript
import Worker from 'web-worker';

const worker = new Worker(`data:application/javascript,postMessage(42)`);
worker.addEventListener('message', e => {
  console.log(e.data)  // 42
});
```

--------------------------------

### Register Multiple Event Listeners for Same Event Type

Source: https://context7.com/developit/web-worker/llms.txt

Demonstrates registering multiple handlers for the same event type on a worker. Both property handlers (onmessage) and addEventListener methods can be used together, and all registered handlers will be invoked when the event fires.

```javascript
import Worker from 'web-worker';

const worker = new Worker('data:,postMessage("test")');

// Property handler
worker.onmessage = (e) => {
  console.log('Handler 1:', e.data); // Output: Handler 1: test
};

// First addEventListener
worker.addEventListener('message', (e) => {
  console.log('Handler 2:', e.data); // Output: Handler 2: test
});

// Second addEventListener
worker.addEventListener('message', (e) => {
  console.log('Handler 3:', e.data); // Output: Handler 3: test
});

// All three handlers will be called
```

--------------------------------

### Send Messages to Worker Threads using postMessage

Source: https://context7.com/developit/web-worker/llms.txt

Illustrates sending data to a worker thread using the `postMessage` method. Supports sending primitive types, objects, and transferable objects like ArrayBuffers. The worker can process this data and send results back.

```javascript
import Worker from 'web-worker';

const worker = new Worker('data:,onmessage=e=>postMessage(e.data*2)', { type: 'module' });

worker.addEventListener('message', (event) => {
  console.log('Result:', event.data); // Output: Result: 84
  console.log('Event type:', event.type); // Output: Event type: message
  console.log('Timestamp:', event.timeStamp); // Output: Timestamp: 1234567890
});

// Send message to worker
worker.postMessage(42);

// With transferable objects
const buffer = new ArrayBuffer(8);
worker.postMessage({ buffer }, [buffer]);
```

--------------------------------

### Create and Use Web Worker with Data URL

Source: https://github.com/developit/web-worker/blob/main/README.md

Creates a worker from an inline data URL and handles message events. The worker posts a simple message that is logged in the main thread. This is the simplest way to instantiate a worker without external files.

```JavaScript
import Worker from 'web-worker';

const worker = new Worker('data:,postMessage("hello")');
worker.onmessage = e => console.log(e.data);  // "hello"
```

--------------------------------

### Terminate Worker Threads Gracefully with terminate()

Source: https://context7.com/developit/web-worker/llms.txt

Shows how to immediately stop a worker thread using the `terminate` method. This is useful for cleaning up resources or when a worker is no longer needed. The worker stops execution upon termination.

```javascript
import Worker from 'web-worker';

const worker = new Worker('data:,setInterval(()=>postMessage(Date.now()),100)');
worker.onmessage = e => console.log('Tick:', e.data);

// Terminate after 1 second
setTimeout(() => {
  worker.terminate();
  console.log('Worker terminated');
}, 1000);
```

--------------------------------

### Implement Worker Message Handler

Source: https://github.com/developit/web-worker/blob/main/README.md

Defines the worker-side message handler that listens for incoming messages and sends responses. The worker uses addEventListener to receive messages and postMessage to send data back to the main thread. This runs within the worker context.

```JavaScript
addEventListener('message', e => {
  if (e.data === 'hello') {
    postMessage('hiya!');
  }
});
```

--------------------------------

### Handle Worker Errors with Property and Event Listeners

Source: https://context7.com/developit/web-worker/llms.txt

Demonstrates two methods to handle worker errors: using the onerror property and addEventListener. The property-based approach directly assigns an error handler, while addEventListener allows multiple listeners. Both methods receive an error object containing the message and type properties. The preventDefault() method can be called to prevent default error handling behavior.

```javascript
import Worker from 'web-worker';

const worker = new Worker(
  'data:,throw new Error("Something went wrong")'
);

// Property-based error handler
worker.onerror = (error) => {
  console.error('Error via property:', error.message);
  console.error('Error type:', error.type);
};

// addEventListener error handler
worker.addEventListener('error', (error) => {
  console.error('Error via listener:', error.message);
  // Prevent default error handling
  error.preventDefault?.();
});
```

--------------------------------

### Graceful Error Handling with Try-Catch in Worker

Source: https://context7.com/developit/web-worker/llms.txt

Implements error handling within the worker thread itself using try-catch blocks to gracefully handle errors and communicate them back to the main thread via postMessage. This approach allows the worker to continue running after an error and send structured error responses containing success status and error details.

```javascript
import Worker from 'web-worker';

const safeWorker = new Worker(`data:,
  addEventListener('message', e => {
    try {
      const result = riskyOperation(e.data);
      postMessage({ success: true, result });
    } catch (err) {
      postMessage({ success: false, error: err.message });
    }
  });

  function riskyOperation(data) {
    if (!data) throw new Error('No data provided');
    return data * 2;
  }
`);

safeWorker.onmessage = (e) => {
  if (e.data.success) {
    console.log('Result:', e.data.result);
  } else {
    console.error('Worker error:', e.data.error);
  }
};

safeWorker.postMessage(42); // Success
safeWorker.postMessage(null); // Handled error
```

--------------------------------

### Access Worker Name Property via self.name

Source: https://context7.com/developit/web-worker/llms.txt

Demonstrates accessing the worker's name from within the worker scope. The name is specified when creating the worker via the options parameter and is accessible via self.name inside the worker context for logging or identification purposes.

```javascript
import Worker from 'web-worker';

const worker = new Worker(
  new URL('./named-worker.js', import.meta.url),
  { type: 'module', name: 'DataProcessor' }
);

worker.onmessage = (e) => {
  console.log(e.data); // Output: "Worker 'DataProcessor' initialized"
};
```

```javascript
// Access worker name via self.name
postMessage(`Worker '${self.name}' initialized`);

addEventListener('message', (e) => {
  console.log(`[${self.name}] Processing:`, e.data);
  postMessage(`[${self.name}] Done`);
});
```

--------------------------------

### Access Event Object Properties in Message Handlers

Source: https://context7.com/developit/web-worker/llms.txt

Shows how to access various properties of the event object in message event handlers, including data, timeStamp, type, target, and currentTarget. These properties provide metadata about the message and its source.

```javascript
import Worker from 'web-worker';

const workerCode = `
  addEventListener('message', e => {
    postMessage({
      receivedData: e.data,
      receivedAt: e.timeStamp,
      eventType: e.type
    });
  });
`;

const worker = new Worker(
  `data:application/javascript,${encodeURIComponent(workerCode)}`
);

worker.addEventListener('message', (event) => {
  console.log('Data:', event.data);
  console.log('Type:', event.type); // Output: Type: message
  console.log('Timestamp:', event.timeStamp); // Unix timestamp
  console.log('Target:', event.target); // Worker instance
  console.log('CurrentTarget:', event.currentTarget); // Worker instance
});

worker.postMessage({ value: 123 });
```

--------------------------------

### Terminate Worker from Within Using WorkerGlobalScope.close()

Source: https://context7.com/developit/web-worker/llms.txt

Demonstrates how to terminate a web worker from within the worker itself using self.close(). The main thread sends a message to the worker, which processes the task, sends a final message back, and then closes itself. Both the message and close events are handled in the main thread.

```javascript
import Worker from 'web-worker';

const worker = new Worker('./self-closing-worker.js', { type: 'module' });

worker.addEventListener('message', (e) => {
  console.log('Final message:', e.data); // Output: Final message: "Task complete"
});

worker.addEventListener('close', () => {
  console.log('Worker closed itself'); // Output: Worker closed itself
});

worker.postMessage('process');
```

```javascript
addEventListener('message', (e) => {
  if (e.data === 'process') {
    // Do some work
    const result = 'Task complete';

    // Send result
    postMessage(result);

    // Close worker
    self.close();
  }
});
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.