Sobes.tech
Middle

Kā izveidot Web Worker plūsmu JavaScript?

sobes.tech AI

Atbilde no AI

JavaScript-ā Web Worker plūsmu var izveidot, izmantojot Worker konstruktoru.

// Izveidojam jaunu Web Worker, nododot ceļu uz JS failu,
// kas tiks izpildīts atsevišķā plūsmā.
const worker = new Worker('worker.js'); 

worker.js failā (vai jebkurā citā failā, kas norādīts worker izveidē) tiks izpildīts kods atsevišķā plūsmā.

// worker.js

// Ziņojumu apstrāde, kas nosūtīti no galvenās plūsmas
self.onmessage = function(event) {
  const receivedData = event.data;
  console.log('Saņemta ziņa no galvenās plūsmas:', receivedData);

  // Ziņojuma sūtīšana atpakaļ galvenajā plūsmā
  const responseData = { message: 'Sveiciens no Worker!', data: receivedData };
  self.postMessage(responseData);
};

// Vēlams, var pievienot kļūdu apstrādi
self.onerror = function(error) {
  console.error('Kļūda Worker:', error);
};

Galvenajā plūsmā (kur tika izveidots workeris) var ar to sadarboties:

// main.js

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

// Sūtīt ziņu Web Worker
worker.postMessage({ command: 'start', payload: 'kādi dati' });

// Apstrādāt ziņas, kas saņemtas no Web Worker
worker.onmessage = function(event) {
  const receivedData = event.data;
  console.log('Saņemta ziņa no Worker:', receivedData);
};

// Kļūdu apstrāde Web Worker
worker.onerror = function(error) {
  console.error('Galvenās plūsmas kļūda:', error);
};

// Beigt Web Worker (neobligāti)
// worker.terminate(); 

Galvenie punkti:

  • Sazināšanās: Datu apmaiņa starp galveno plūsmu un worker notiek ar postMessage() metodi un onmessage apstrādātāju.
  • Ierobežojumi: Workeriem nav piekļuves DOM, window objektam un citiem pārlūkprogrammas globālajiem objektiem. Viņiem ir ierobežota piekļuve navigator, location, XMLHttpRequest, setTimeout, setInterval, fetch, WebSockets un citiem.
  • Izolācija: Worker koda izpilde notiek atsevišķā plūsmā, kas novērš galvenās plūsmas bloķēšanu un uzlabo veiktspēju, īpaši veicot resursu prasīgas aprēķinus.