HTML

HTML5 Web Çalışanı (Workers)

Web çalışanı, sayfanın performansını etkilemeden arka planda çalışan bir JavaScript kodudur.


Web Çalışanı Nedir?

HTML sayfasında bir script çalıştırıldığında, script bitene kadar sayfa kullanıcıya cevap veremez hale gelir.

Web çalışanı, sayfanın performansını etkilemeden diğer script’lerden bağımsız olarak arka planda çalışan bir JavaScript kodudur. İstediğiniz başka her türlü şeyi yapmaya devam edebilirsiniz: tıklama, nesneleri seçme vs…

HTML5 Web Workers Örneği

Aşağıdaki örnek, arka planda sayı sayan basit bir web çalışanı oluşturur:

Örnek

Saymaya Başla:

Tarayıcı Desteğini Kontrol Etme

Bir web worker oluşturmadan önce bu işlemi mutlaka yapın:

if(typeof(Worker) !== “undefined”)
{
// Evet! Web Worker Destekleniyor!
// Kod satırları…..
}
else
{
// Tarayıcınız Web Worker özelliğini desteklemiyor.
}

 


Bir Web Worker Dosyası Oluşturma

Şimdi, kendi harici JavaScript web worker dosyamızı oluşturalım.

Burda, sayı sayan bir script oluşturuyoruz. Script, “demo_workers.js” dosyası içinde saklanacak:

var i = 0;

function timedCount()
{
i = i + 1;
postMessage(i);
setTimeout(“timedCount()”,500);
}

timedCount();

Yukarıdaki kodda önemli olan kısım, HTML dosyasına mesaj göndermek için kullanılan postMessage()metodudur.

Not: Normalde web çalışanları böyle basit scriptler için kullanılmaz. Daha çok yoğun ve ağır CPU (işlemci) işlemleri için kullanılır.


Bir Web Worker Nesnesi Oluşturmak

Artık bir web worker dosyamız var, şimdi yapmamız gereken onu bir HTML dosyası ile çağırmak.

Aşağıdaki satırlar bir worker olup olmadığını kontrol eder, eğer yoksa yeni bir tane yaratır ve “demo_workers.js” içindeki kodları çalıştırır:

if(typeof(w) == “undefined”)
{
w = new Worker(“demo_workers.js”);
}

Artık worker’dan mesaj alabilir ya da worker’a mesaj gönderebiliriz.

Web Çalışanına bir tane “onmessage” olay dinleyicisi (event listener) ekleyin.

w.onmessage = function(event){
document.getElementById(“result”).innerHTML = event.data;
};

Web çalışanı bir mesaj gönderdiğinde, event listener içindeki kod çalışır. Web çalışanından alınan veri, event.data içerisinde saklanır.


Web Çalışanını Bitirmek / Silmek

Bir Web Worker nesnesi oluşturulduğunda, silinene kadar mesajları dinlemeye (harici script sonradan kapatılsa bile) devam eder.

Bir web çalışanını silmek ve tarayıcının/bilgisayarın kaynaklarını serbest bırakmak için terminate() metodunu kullanın:

w.terminate();

 


Web Çalışanı ve DOM (Document Object Model – Döküman Nesne Modeli)

Web Çalışanları harici dosyalar oldukları için, aşağıdaki JavaScript nesnelerine ulaşamazlar:

  • window object
  • document object
  • parent object

 

Related Articles

Leave a Reply

Check Also

Close
Close

Reklam Engelleme

Please consider supporting us by disabling your ad blocker