Referință rapidă

Ghid Rapid Web Workers în JavaScript

Ghid rapid de referință pentru HTML5 Web Workers: instanțierea workerilor, comunicarea prin postMessage, evenimente de mesaje și algoritmul de clonare structurată.

· Publicat

Web Workers oferă o modalitate simplă de a rula scripturi în fire de execuție în fundal fără a bloca interfața utilizator.

Execuție în fundal (Threading)

Firul principal de execuție (Client)

const worker = new Worker('worker.js');

worker.onmessage = function (event) {
  console.log('Recepționat de la worker:', event.data);
};

worker.postMessage('salut din firul principal!');

Mesajele pot fi de orice tip de date acceptat de algoritmul de clonare structurată (obiecte, tablouri, șiruri, numere, blob-uri, tablouri tipizate).

Firul de execuție al Worker-ului

// În worker.js
self.onmessage = function (event) {
  console.log('Recepționat în worker:', event.data);
  self.postMessage({ msg: 'răspuns de la worker' });
};

Structura MessageEvent

bubbles: false
cancelBubble: false
cancelable: false
clipboardData: undefined
currentTarget: Worker
data: "Hello"             // Datele transferate (payload)
defaultPrevented: false
eventPhase: 0
lastEventId: ""
origin: ""
ports: []
returnValue: true
source: null
srcElement: Worker
target: Worker
timeStamp: 1344821022383
type: "message"

Aceste câmpuri descriu proprietățile disponibile pe obiectul MessageEvent în cadrul onmessage.

Subiecte conexe