Γρήγορη αναφορά

Web Workers Σημειώσεις

Ένας γρήγορος οδηγός αναφοράς για τα HTML5 Web Workers: δημιουργία worker, επικοινωνία με postMessage, συμβάντα μηνυμάτων και αλγόριθμος structured clone.

· Δημοσιεύτηκε

Τα Web Workers παρέχουν έναν απλό τρόπο εκτέλεσης σεναρίων σε νήματα παρασκηνίου χωρίς να επηρεάζεται η διεπαφή χρήστη.

Νήματα Παρασκηνίου (Background Threading)

Κύριο Νήμα Πελάτη (Client Thread)

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

worker.onmessage = function (event) {
  console.log('Λήφθηκε από το worker:', event.data);
};

worker.postMessage('γεια από το κύριο νήμα!');

Τα μηνύματα μπορούν να είναι οποιουδήποτε τύπου δεδομένων υποστηρίζεται από τον Αλγόριθμο Δομημένης Κλωνοποίησης (Structured Clone Algorithm) (αντικείμενα, πίνακες, συμβολοσειρές, αριθμοί, blobs, typed arrays).

Νήμα Worker (Worker Thread)

// Μέσα στο worker.js
self.onmessage = function (event) {
  console.log('Λήφθηκε στο worker:', event.data);
  self.postMessage({ msg: 'απάντηση από το worker' });
};

Δομή MessageEvent

bubbles: false
cancelBubble: false
cancelable: false
clipboardData: undefined
currentTarget: Worker
data: "Hello"             // Μεταφερόμενο ωφέλιμο φορτίο
defaultPrevented: false
eventPhase: 0
lastEventId: ""
origin: ""
ports: []
returnValue: true
source: null
srcElement: Worker
target: Worker
timeStamp: 1344821022383
type: "message"

Αυτά τα πεδία περιγράφουν τις διαθέσιμες ιδιότητες στο αντικείμενο MessageEvent στο onmessage.

Σχετικά θέματα