Web Workers nedir?

Web Workers ile ağır işlemleri arka plan dizisine taşıyıp ana diziyi bloklamamayı öğrenirsin.

Web Workers nedir?

Web Worker, JavaScript kodunu ana diziden ayrı bir arka plan dizisinde (background thread) çalıştıran mekanizmadır. Normalde tüm JavaScript tek dizide çalışır; uzun süren bir işlem ana diziyi bloklar ve sayfa donar.

Bir worker, ağır hesaplamaları arkada yürütüp ana diziyi serbest tutar. Böylece kullanıcı arayüzü akıcı kalır ve düğmeler hâlâ tıklanabilir olur. Worker ile ana dizi yalnızca mesajlaşarak haberleşir; bellek doğrudan paylaşılmaz.

Worker kapsamı

Bir worker ayrı bir global kapsamda (worker scope) çalışır; window nesnesine erişemez. Bunun yerine self anahtar sözcüğü worker'ın global nesnesini verir.

Worker içinden document, localStorage ya da console gibi tarayıcı API'lerinin bir kısmı kullanılamaz. Ancak fetch, IndexedDB ve setTimeout gibi API'ler worker'da çalışır. DOM'a dokunmak yasaktır; arayüzü yalnızca ana dizi günceller.

Uygulama Web Worker desteğini denetle

window üzerinde 'Worker' özelliğinin varlığını in ile kontrol et. Yoksa console.log ile 'unsupported', varsa 'supported' yazdır.

Örnek çözümü göster

if (!('Worker' in window)) {
  console.log('unsupported');
} else {
  console.log('supported');
}

Kendini test et

Bir Web Worker ne işe yarar?
- Ağır işlemi arka plan dizisinde çalıştırıp ana diziyi bloklamaz
- Sayfadaki tüm HTML öğelerini seçer
- Sunucudan veri çeker
- CSS stillerini değiştirir
Cevabı göster

Ağır işlemi arka plan dizisinde çalıştırıp ana diziyi bloklamaz — Doğru! Worker ağır hesabı arka plan dizisinde yapar, ana dizi serbest kalır.
Worker ve ana dizi farkları

window

ana dizi globali
self

worker globali
document

yalnız ana dizi
postMessage

iki taraf da

Worker oluştur

const worker = new ____('sorter.js');

Cevabı göster

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

Sıradaki ders: Worker oluşturma

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler