JavaScriptте Web Worker агымын кантип түзүү керек…

JavaScript-те Web Worker түзүү үчүн Worker конструктору колдонулат, ал скрипттин жолун кабыл алат, ал бөлүнгөн агымда иштейт:

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

Worker скрипти (worker.js) башка глобалдык контекстте иштейт, ал DOM же глобалдык объект windowке жетпейт. Маалымат алмашуу үчүн негизги скрипт жана воркер ортосунда postMessage() ыкмасы жана onmessage окуя иштетүүчү колдонулат:

Негизги скриптте:

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

// Маалыматты воркерге жөнөтүү
worker.postMessage({ data: 'Салам негизги агымдан!' });

// Воркерден келген билдирүүлөрдү иштетүү
worker.onmessage = function(event) {
  console.log('Алынады воркерден:', event.data);
};

// Воркердин каталарын иштетүү (міндеттүү эмес)
worker.onerror = function(error) {
  console.error('Воркердеги каталар:', error);
};

// Воркер ишин токтотуу
// worker.terminate();

Worker скрипти (worker.js):

// Негизги агымдан келген билдирүүлөрдү иштетүү
self.onmessage = function(event) {
  console.log('Воркерде алынган:', event.data);

  // Узак мөөнөттүү операцияны аткаруу (мисал)
  let result = 0;
  for (let i = 0; i < 1000000000; i++) {
    result += i;
  }

  // Натыйжаны кайра негизги агымга жөнөтүү
  self.postMessage({ result: result, originalData: event.data });
};

// Воркер ичиндеги каталарды иштетүү (міндеттүү эмес)
self.onerror = function(error) {
  console.error('Воркер ичиндеги каталар:', error);
};

// Воркер башка скрипттерди импорттой алат
// importScripts('utils.js', 'helper.js');

Web Workers ресурстук оор эсептөөлөрдү бөлүнгөн агымга өткөрүүгө мүмкүндүк берет, бул негизги UI агымын бөгөттөөдөн сактайт жана колдонмонун жоопкерчилигин жакшыртат. Чектөөлөрдү эске алуу керек: воркерлер DOM, window, document, localStorage жана sessionStorage түздөн-түз жеткиликтүү эмес. Маалымат алмашуу маанилердин көчүрмөсү аркылуу же Transferable объекттери колдонулуп, чоң көлөмдөгү маалыматтарды өткөрүүдө натыйжалуулук жогорулайт.

JavaScriptте Web Worker агымын кантип түзүү керек?