JavaScript motoru, performans ve bellek
Motorun kodu nasıl derleyip iyileştirdiğini, çöp toplayıcıyı ve bellek sızıntılarını profil araçlarıyla inceler, ölçerek hızlandırırsın.
Seviye 501 · 13 ders · 12 pratik lab
Dersler
Motorun içi
- Ayrıştırma, yorumlama ve anında derleme
- Gizli sınıflar ve satır içi önbellekler
- İyileştirmenin geri alınması
- Kısa görev: yanıltmayan küçük bir ölçüm yaz
Bellek
- Çöp toplama ve kuşaklar
- Yığın anlık görüntüsü okumak
- Sık görülen sızıntılar: dinleyiciler, kapanışlar, önbellekler
- Kısa görev: tek sayfalık uygulamada sızıntıyı bul
Hız
- CPU profili ve alev grafiği
- Uzun görevler ve etkileşim gecikmesi
- İşi bölmek ve tarayıcıya nefes aldırmak
- WebAssembly’ye ne zaman başvurulur
- Bitirme görevi: yavaş bir uygulamayı ölçerek hızlandır
Pratik lablar
- Yanıltıcı ölçümü düzelt: Tek bir Date.now ölçümüyle "hızlı" ilan edilen fonksiyonu ısınma turları ve tekrarlarla yeniden ölç.
- Nesne şeklini sabitleyip döngüyü hızlandır: Alanları farklı sırayla eklenen nesneler yüzünden yavaşlayan bir döngüyü nesne şeklini sabitleyerek hızlandır.
- Deoptimizasyonun izini sür: Ara sıra farklı türde argüman alan sıcak bir fonksiyonun deoptimizasyonunu Node bayraklarıyla yakalayıp nedenini düzelt.
- Heap görüntüsünde en büyük nesneyi bul: Belleği büyüyen bir sayfanın heap anlık görüntüsünde en çok yer tutan nesneyi ve onu tutanı bul.
- Kaldırılmayan dinleyici sızıntısını kapat: Her açılışta pencereye dinleyici ekleyip hiç kaldırmayan bir modalın büyüttüğü belleği düzelt.
- Sınırsız önbelleği LRU ile sınırla: Her aramayı sonsuza dek tutan bir önbelleği LRU sınırıyla yeniden yaz ve iki anlık görüntüyle farkı kanıtla.
- Alev grafiğinde sıcak fonksiyonu bul: Yavaş açılan bir tablo sayfasının CPU profilinde süreyi en çok yiyen fonksiyonu bul.
- Filtre tıklamasındaki uzun görevi böl: Filtre butonuna basınca 400 ms donan sayfadaki uzun görevi parçalara bölüp tarayıcıya nefes aldır.
- Her karede tekrarlanan sıralamayı önle: Profilde her karede yeniden yapılan pahalı bir sıralamayı bulup yalnızca veri değişince çalışacak hale getir.
- WebAssembly modülünü JavaScript'ten çağır: Hazır derlenmiş bir .wasm modülünü yükleyip içindeki toplama fonksiyonunu JavaScript'ten çağır.
- Aynı işi JS ve WebAssembly ile karşılaştır: Bir görüntü bulanıklaştırma işini JS ve hazır wasm sürümüyle ölç, veri aktarım maliyetini de hesaba kat.
- Sahadaki uzun görevleri kaydet: PerformanceObserver ile kullanıcı oturumlarındaki uzun görevleri kaydedip en sık görüleni bul ve düzelt.
Kurs hakkında
Motorun kodu nasıl derleyip iyileştirdiğini, çöp toplayıcıyı ve bellek sızıntılarını profil araçlarıyla inceler, ölçerek hızlandırırsın.
Ne öğreneceksin
Ön koşullar
Aynı yolun 401 düzeyine kadar olan konularında deneyimli olmalısın.
Lab ortamı
Dersler, tarayıcında açılan sana özel bir Kali Linux masaüstünde geçer; araçlar pencereli arayüzleriyle hazırdır. Kurulum gerekmez, bilgisayar ekranı önerilir.
Sık sorulan sorular
- Bu kurs benim düzeyime uygun mu?
- Kurs 501 düzeyindedir; daha düşük düzeydeki kursların konularını bildiğin varsayılır.
- Kurulum gerekir mi?
- Hayır. Her ders tarayıcında açılan sana özel bir lab ortamında geçer.
- Dersler nasıl işleniyor?
- Her ders 8 ile 10 adımdan ve bir kısa sınavdan oluşur. İlk adımlarda yazman gereken komut gösterilir, sonraki adımlarda yardım azalır; iki denemede takılırsan çözüm açılır.
- Ücretsiz deneyebilir miyim?
- Evet. Her kursun ilk üç dersi ücretsizdir.