Web Workers bieden een eenvoudige manier om scripts op de achtergrond uit te voeren zonder de gebruikersinterface te blokkeren.
Threading op de achtergrond
Hoofd-client-thread
const worker = new Worker('worker.js');
worker.onmessage = function (event) {
console.log('Ontvangen van worker:', event.data);
};
worker.postMessage('hallo vanaf de hoofdthread!');
Berichten kunnen elk gegevenstype bevatten dat wordt ondersteund door het gestructureerde kloonalgoritme (objecten, arrays, strings, getallen, blobs, getypeerde arrays).
Worker-thread
// In worker.js
self.onmessage = function (event) {
console.log('Ontvangen in worker:', event.data);
self.postMessage({ msg: 'reactie van worker' });
};
MessageEvent-structuur
bubbles: false
cancelBubble: false
cancelable: false
clipboardData: undefined
currentTarget: Worker
data: "Hello" // Overgedragen payload
defaultPrevented: false
eventPhase: 0
lastEventId: ""
origin: ""
ports: []
returnValue: true
source: null
srcElement: Worker
target: Worker
timeStamp: 1344821022383
type: "message"
Deze velden beschrijven de beschikbare eigenschappen op het MessageEvent-object in onmessage.