Co jsou weboví pracovníci a k čemu slouží?

Webové pracovníky jsou způsob, jak spouštět kód JavaScript na pozadí, odděleně od hlavního vlákna uživatelského rozhraní prohlížeče.

Účel:

• Provádět náročné výpočty bez blokování hlavního vlákna, což zabraňuje zamrznutí rozhraní.
• Zpracovávat velká data nebo provádět dlouhotrvající operace (například parsing, komprese, síťové požadavky v některých případech) na pozadí.
• Zlepšit výkon a odezvu webových aplikací.

Typy webových pracovníků:

1. Dedicated Worker: Je spojen s skriptem, který ho vytvořil.
2. Shared Worker: Může být sdílen mezi několika skripty běžícími v různých oknech nebo záložkách stejné domény.
3. Service Worker: Zachytává síťové požadavky, spravuje cache, zajišťuje offline přístup, podporuje push notifikace.

Příklad vytvoření a použití Dedicated Worker:

// main.js (hlavní vlákno)
const worker = new Worker('worker.js');

// Odeslání zprávy workerovi
worker.postMessage('Začít těžké výpočty');

// Přijímání zpráv od workera
worker.onmessage = function(event) {
  console.log('Přijato od workera:', event.data);
};

// worker.js (kód workera)
self.onmessage = function(event) {
  console.log('Přijato ve workeru:', event.data);

  // Simulace těžkých výpočtů
  let result = 0;
  for (let i = 0; i < 1000000000; i++) {
    result += i;
  }

  // Odeslání zprávy zpět do hlavního vlákna
  self.postMessage('Výpočty dokončeny, výsledek: ' + result);
};

Omezení:

• Přímý přístup k DOM není možný.
• Nelze používat některé globální proměnné hlavního vlákna (například window, document).
• Komunikace probíhá prostřednictvím asynchronního výměny zpráv (postMessage a onmessage/addEventListener('message')).
• Data mezi vlákny jsou přenášena kopírováním (structured clone algoritmus), ale pro velká data lze použít Transferable Objects pro přenos odkazem (ztráta přístupu v původním vlákně).