Sobes.tech
Middle

Kā izveidot Web Worker plūsmu JavaScript?

sobes.tech AI

Atbilde no AI

JavaScript-ā Web Worker izveide tiek veikta ar Worker konstruktoru, kas pieņem ceļu uz skriptu, kas tiek izpildīts atsevišķā pavedienā:

const worker = new Worker('path/to/worker.js');

Worker skripts (worker.js) tiks izpildīts citā globālā kontekstā, kam nav piekļuves DOM vai globālajam objektam window. Datu apmaiņai starp galveno skriptu un worker tiek izmantotas metodes postMessage() un notikuma onmessage apstrādātājs:

Galvenajā skriptā:

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

// Datu nosūtīšana worker
worker.postMessage({ data: 'Sveiki no galvenās plūsmas!' });

// Ziņojumu apstrāde no worker
worker.onmessage = function(event) {
  console.log('Saņemts no worker:', event.data);
};

// Kļūdu apstrāde no worker (nav obligāti)
worker.onerror = function(error) {
  console.error('Kļūda worker:', error);
};

// Worker pabeigšana
// worker.terminate();

Worker skriptā (worker.js):

// Ziņojumu apstrāde no galvenās plūsmas
self.onmessage = function(event) {
  console.log('Saņemts worker:', event.data);

  // Ilgstošas operācijas veikšana (piemērs)
  let result = 0;
  for (let i = 0; i < 1000000000; i++) {
    result += i;
  }

  // Rezultāta nosūtīšana atpakaļ galvenajai plūsmai
  self.postMessage({ result: result, originalData: event.data });
};

// Kļūdu apstrāde worker iekšienē (nav obligāti)
self.onerror = function(error) {
  console.error('Kļūda worker iekšienē:', error);
};

// Worker var importēt citus skriptus
// importScripts('utils.js', 'helper.js');

Web Workers ļauj novietot resursu intensīvas aprēķinu operācijas atsevišķā pavedienā, novēršot galvenā UI pavediena bloķēšanu un uzlabojot lietotāja pieredzi. Jāņem vērā ierobežojumi: worker'iem nav tiešas piekļuves DOM, window, document, localStorage un sessionStorage. Datu apmaiņa notiek, kopējot vērtības vai izmantojot Transferable objektus, lai paaugstinātu efektivitāti, pārsūtot lielus datu apjomus.