Perhitungan yang panjang pada thread utama dapat memblokir klik, pengetikan, dan pengecatan. Pekerja Web menjalankan JavaScript dalam konteks global terpisah dan berkomunikasi dengan halaman melalui pesan.

const worker = new Worker(
  new URL("./search.worker.js", import.meta.url),
  { type: "module" },
);

worker.addEventListener("message", ({ data }) => {
  renderResults(data);
});
worker.postMessage({ query, records });
// search.worker.js
self.addEventListener("message", ({ data }) => {
  const results = expensiveSearch(data.records, data.query);
  self.postMessage(results);
});

Jaga agar batasan pesan tetap disengaja

  • Kirimkan data terkecil yang dibutuhkan pekerja; kloning terstruktur itu sendiri dapat memakan biaya yang mahal untuk grafik objek yang besar.
  • Gunakan buffer yang dapat ditransfer untuk data biner ketika kepemilikan dapat berpindah ke pekerja.
  • Tangani kesalahan pekerja dan hentikan ketika antarmuka pemiliknya dihapus secara permanen.

Pekerja tidak dapat memanipulasi halaman DOM secara langsung. Kirim hasilnya kembali ke thread utama dan perbarui antarmuka di sana.