Kaip sukurti Web Worker srautą JavaScript?
sobes.tech AI
Atsakymas iš AI
JavaScript'e Web Worker'į sukurti naudojamas Worker konstruktorius, kuris priima skripto kelią, vykdomą atskirame sraute:
const worker = new Worker('path/to/worker.js');
Worker'o skriptas (worker.js) vykdomas kitame globaliame kontekste, kuris neturi prieigos prie DOM ar globalaus objekto window. Duomenų mainams naudojami postMessage() metodas ir onmessage įvykio tvarkyklė:
Pagrindiniame skripte:
const worker = new Worker('worker.js');
// Duomenų siuntimas worker'ui
worker.postMessage({ data: 'Sveiki iš pagrindinio srauto!' });
// Žinučių apdorojimas iš worker'o
worker.onmessage = function(event) {
console.log('Gauta iš worker:', event.data);
};
// Klaidos apdorojimas iš worker'o (nebūtina)
worker.onerror = function(error) {
console.error('Klaida worker:', error);
};
// Worker'o darbo pabaiga
// worker.terminate();
Worker'o skripte (worker.js):
// Žinučių apdorojimas iš pagrindinio srauto
self.onmessage = function(event) {
console.log('Gauta worker:', event.data);
// Ilgalaikės operacijos vykdymas (pavyzdys)
let result = 0;
for (let i = 0; i < 1000000000; i++) {
result += i;
}
// Rezultato siuntimas atgal į pagrindinį srautą
self.postMessage({ result: result, originalData: event.data });
};
// Klaidos apdorojimas worker'o viduje (nebūtina)
self.onerror = function(error) {
console.error('Klaida worker viduje:', error);
};
// Worker gali importuoti kitus skriptus
// importScripts('utils.js', 'helper.js');
Web Workers leidžia išskirti resursų intensyvius skaičiavimus į atskirą srautą, taip išvengiant pagrindinio UI srauto blokavimo ir gerinant programėlės reakciją. Reikėtų atsižvelgti į apribojimus: worker'iai neturi tiesioginės prieigos prie DOM, window, document, localStorage ir sessionStorage. Duomenų mainai vyksta kopijuojant reikšmes arba naudojant Transferable objektus, siekiant padidinti efektyvumą perduodant didelius duomenų kiekius.