JavaScript Academy · Ders

Web Worker Oluşturma

İşler için arka planda çalışan bir iş parçacığı başlatın.

Web Worker Oluşturma, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 1. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, JavaScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. JavaScript Academy kursu toplamda 4 dersten oluşur.

Web Worker'lar Neden Kullanılır

JavaScript tek bir ana iş parçacığında çalışır. Uzun süren bir hesaplama her şeyi engeller: kullanıcı arayüzü donar ve tıklamalar yanıt vermez. Web worker'ları betikleri arka plandaki bir iş parçacığında çalıştırarak page'in yanıt vermeye devam etmesini sağlar.

Worker Oluşturma

Bir betik adresini Worker kurucusuna aktararak worker oluşturun. Tarayıcı bu dosyayı yükler ve ayrı bir iş parçacığında çalıştırır.

const worker = new Worker('worker.js');
// The code in worker.js now runs on its own thread.

Worker Betiği

worker dosyası düz JavaScript içerir, ancak kendi genel kapsamı içinde çalışır (window yoktur, document yoktur). Yalnızca iletiler aracılığıyla iletişim kurar.

// worker.js
console.log('worker started');
// This runs off the main thread.

İki Ayrı Genel Kapsam

Ana page ile worker'ın her birinin kendine ait genel kapsamı ve belleği vardır. Değişkenleri doğrudan paylaşamazlar; iletiler aracılığıyla verilerin kopyalarını karşılıklı olarak gönderirler.

Ana iş parçacığı: window, DOM, kullanıcı arayüzü
Worker iş parçacığı: self, hesaplama, DOM yok

Worker İçinde Self

Bir worker'ın içinde genel nesne self (DedicatedWorkerGlobalScope) olur. İşleyicileri buna bağlayıp API'leri bunun üzerinde çağırabilirsiniz; ancak self çoğu zaman örtük olarak kullanılır.

// worker.js
self.addEventListener('message', (e) => {
  console.log('worker got:', e.data);
});

Modül Worker'ları

type: 'module' seçeneğini aktararak ES modülü import kullanan bir worker oluşturabilirsiniz. Böylece worker, diğer modülleri düzenli bir şekilde içe aktarabilir.

const worker = new Worker('worker.js', { type: 'module' });
// Inside worker.js you can now use import statements.

Betiği İçe Aktarma (Klasik)

Klasik, yani modül kullanmayan bir worker'da, worker kapsamına ek betikleri eş zamanlı olarak yüklemek için importScripts kullanın.

// Inside a classic worker:
importScripts('math-utils.js', 'helpers.js');
// Their globals are now available in the worker.

Worker'ı Sonlandırma

Bir worker'ı ana iş parçacığından worker.terminate() ile, içinden ise self.close() ile durdurun. Bu işlem iş parçacığını ve belleğini serbest bırakır.

// From the main thread:
worker.terminate();

// From inside the worker:
// self.close();

Worker Hatalarını Ele Alma

Worker üzerinde error olayını dinleyerek worker içinde oluşan ve yakalanmamış özel durumları yakalayın. Olay; iletiyi, dosya adını ve satır numarasını taşır.

worker.addEventListener('error', (e) => {
  console.log('worker error:', e.message, 'at line', e.lineno);
});

Aynı Kaynak Gereksinimi

Worker betiği page ile aynı kaynaktan veya bir Blob adresi üzerinden sunulmalıdır. Bir worker'ı doğrudan rastgele bir farklı kaynak adresinden yükleyemezsiniz.

// Same-origin file path - works:
const w1 = new Worker('/js/worker.js');

// You can also build one from a Blob URL when needed.

Adanmış ve Paylaşımlı Worker'lar

Bir Worker adanmıştır ve onu oluşturan page'e bağlıdır. Bir SharedWorker ise aynı kaynaktaki birden fazla page tarafından kullanılabilir. Bu derste adanmış worker'lara odaklanıyoruz.

Hızlı Kontrol

Web worker'ları oluşturmayı ne kadar anladığınızı ölçün.

Özet

Web worker'ları oluşturmayı öğrendiniz:

new Worker('worker.js') bir arka plan iş parçacığı başlatır.
Worker'ın kendine ait genel nesnesi (self) vardır ve DOM'u yoktur.
İçe aktarmalar için type: 'module', klasik worker'larda ise importScripts kullanın.
terminate() / self.close() worker'ı durdurur.
Worker'lar aynı kaynakta olmalıdır.

Sırada iş parçacıkları arasındaki iletiler var.

Sıkça Sorulan Sorular

“Web Worker Oluşturma” dersi ücretsiz mi?

Evet — “Web Worker Oluşturma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve JavaScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. JavaScript Academy kursu toplamda 4 dersten oluşur.

“Web Worker Oluşturma” dersinde ne öğreneceğim?

İşler için arka planda çalışan bir iş parçacığı başlatın. JavaScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

JavaScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te JavaScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 1. dersidir.

“Web Worker Oluşturma” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu JavaScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her JavaScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← JavaScript Academy Sayfasına Dön