JavaScript Extended #29: Web Worker & Background Task

1. Apa itu Web Worker?

Web Worker adalah fitur browser yang memungkinkan JavaScript menjalankan proses di background thread. Dengan Web Worker, proses berat tidak akan memblokir UI utama.

2. Kenapa Web Worker Penting?

JavaScript pada browser biasanya berjalan di main thread. Jika ada perhitungan berat, UI bisa terasa lag. Web Worker membantu memindahkan tugas berat tersebut ke thread terpisah.

3. Membuat Worker

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

worker.postMessage("Start");

worker.onmessage = function(event) {
  console.log(event.data);
};

4. Kode di worker.js

self.onmessage = function(event) {
  const result = `Pesan diterima: ${event.data}`;
  self.postMessage(result);
};

5. Komunikasi dengan postMessage()

Komunikasi antara main thread dan worker dilakukan dengan postMessage().

6. Keterbatasan Web Worker

  • Tidak bisa mengakses DOM secara langsung
  • Tidak cocok untuk manipulasi UI
  • Lebih cocok untuk perhitungan berat dan pemrosesan data

7. Contoh Use Case

  • Perhitungan data besar
  • Parsing file besar
  • Image processing
  • Operasi background task

8. Ringkasan

  • Web Worker menjalankan kode di background thread
  • Membantu menjaga UI tetap responsif
  • Cocok untuk tugas berat yang tidak butuh akses DOM

Dengan part ini, seri JavaScript Extended dasar sudah selesai.


ariq fadhil

Im Ariq Tech, a Top Rated Fullstack Developer with 5+ years of experience, delivering high-quality solutions across 50+ projects.