JavaScript Academy · Ders

Aktarılabilir Nesneler

Verileri kopyalamadan verimli şekilde taşıyın.

Aktarılabilir Nesneler, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 3. 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.

Kopyalamanın Maliyeti

Yapılandırılmış kopyalama, verileri bayt bayt kopyalar. Büyük buffer'lar (görüntüler, sesler, büyük diziler) için bu kopyalama yavaştır ve bellek kullanımını iki katına çıkarır. Aktarılabilir nesneler, kopyalama yerine sahipliği taşıyarak bu sorunu çözer.

Neler Aktarılabilir

Yalnızca belirli nesne türleri aktarılabilir; bunların en önemlisi ArrayBuffer'dır. Diğerleri arasında MessagePort, ImageBitmap ve OffscreenCanvas bulunur.

ArrayBuffer — ham ikili bellek
MessagePort — kanal uç noktası
ImageBitmap — kodu çözülmüş görüntü verisi

Aktarım Listesi

postMessage ikinci bir bağımsız değişken kabul eder: aktarılabilir nesnelerden oluşan bir liste. Bu listedeki nesneler kopyalanmaz, taşınır.

const buffer = new ArrayBuffer(1024 * 1024); // 1 MB
worker.postMessage(buffer, [buffer]); // transfer it

Sahipliğin Taşınması

Aktarımdan sonra gönderen taraf buffer'ı artık kullanamaz; buffer ayrılmış duruma gelir (byteLength 0). Aynı temel belleğin sahibi artık alıcı taraftır ve hiçbir kopyalama yapılmaz.

const buffer = new ArrayBuffer(8);
worker.postMessage(buffer, [buffer]);
console.log(buffer.byteLength); // 0 - now detached

Türlendirilmiş Dizileri Aktarma

Türlendirilmiş bir dizinin temelindeki ArrayBuffer'ı .buffer özelliği üzerinden aktarırsınız. Görünümün kendisi aktarılamaz, ancak buffer'ı aktarılabilir.

const data = new Float64Array(100000);
worker.postMessage(data, [data.buffer]);
// data is now detached on this side.

Aktarımı Alma

Alıcı taraf, aktarılan nesneyi tıpkı kopyalanmış bir mesaj gibi event.data üzerinden okur. Fark yalnızca hiçbir kopyalama yapılmamış olmasıdır.

// worker.js
self.onmessage = (e) => {
  const buffer = e.data; // we now own this memory
  const view = new Uint8Array(buffer);
  view[0] = 255;
};

Sonuçları Geri Gönderme

Çalışan, işleme sonrasında buffer'ı yine sıfır kopyalamayla geri aktarabilir ve sahipliği ana iş parçacığına geri verebilir.

// worker.js
self.onmessage = (e) => {
  const buffer = e.data;
  // ...process the bytes...
  self.postMessage(buffer, [buffer]); // transfer back
};

Aktarım ve Kopyalama Performansı

Birkaç kilobayt için fark önemsizdir. İkili veri megabaytlarca olduğunda aktarım çok daha hızlıdır ve bellekte ani artışı önler. Büyük buffer'larda aktarımı tercih edin.

Aktarım Sonrası Kullanım Hatalarını Önleme

Yaygın bir hata, buffer'ı aktardıktan sonra okumaktır. Buffer aktarım listesinde göründüğü anda artık yokmuş gibi davranın.

worker.postMessage(buffer, [buffer]);
// BUG: buffer is detached here; this reads zero length.
// const len = buffer.byteLength; // 0

Kopyalanmış ve Aktarılmış Verileri Birleştirme

Bir buffer içeren nesne gönderebilir ve yalnızca bu buffer'ı aktarabilirsiniz. Nesne kopyalanır; listelenen buffer taşınır.

const msg = { type: 'frame', pixels: buffer };
worker.postMessage(msg, [buffer]);
// msg.type is cloned; buffer is transferred.

Aktarım Ne Zaman Kullanılmalı

Görüntü, ses ve video işleme, büyük sayısal hesaplamalar ve büyük ikili veri bloklarını iş parçacıkları arasında taşıyan her türlü veri hattı için aktarılabilir nesneleri kullanın. Küçük JSON benzeri veriler için düz kopyalama daha basittir ve yeterlidir.

Hızlı Kontrol

Aktarılabilir nesneler konusundaki anlayışınızı sınayın.

Özet

Aktarılabilir nesneleri öğrendiniz:

postMessage için ikinci bağımsız değişken olarak bir aktarım listesi geçirin.
ArrayBuffer (ve birkaç nesne daha) kopyalanmak yerine taşınır.
Gönderenin buffer'ı sonrasında ayrılmış duruma gelir.
Türlendirilmiş bir diziyi .buffer üzerinden aktarın.
Büyük ikili veriler için aktarımı, küçük veriler için kopyalamayı kullanın.

Sırada, çalışanların kullanım alanları ve sınırlamaları var.

Sıkça Sorulan Sorular

“Aktarılabilir Nesneler” dersi ücretsiz mi?

Evet — “Aktarılabilir Nesneler” 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.

“Aktarılabilir Nesneler” dersinde ne öğreneceğim?

Verileri kopyalamadan verimli şekilde taşıyı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 3. dersidir.

“Aktarılabilir Nesneler” 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