Hafif Kod logosu

Hafif Kod

Hafif kod yaklaşımıyla performans odaklı teknik blog

Temiz kod, hafif dosyalar, hızlı siteler.

  1. Brotli mi Gzip mi? Sıkıştırmada Hangisi Daha İyi? Brotli ve Gzip'i sıkıştırma oranı, CPU maliyeti ve CDN desteği açısından karşılaştırır; hangi durumda hangisinin tercih edilmesi gerektiğini açıklar.
  2. Versioned Asset Nedir? CSS ve JS Cache Busting Rehberi Query string ve content hash versiyonlama yöntemlerinin farkını, CDN'lerde neden query string'in güvenilmez olduğunu ve doğru cache busting stratejisini açıklar.
  3. Immutable Cache Nedir? Ne Zaman Kullanılır? immutable Cache-Control direktifinin ne anlama geldiğini, content hash stratejisiyle nasıl birleştiğini ve hangi varlık türleri için güvenli olduğunu açıklar.
  4. Cache-Control ve ETag Nasıl Birlikte Çalışır? Cache-Control direktifleri ile ETag doğrulama mekanizmasının birlikte nasıl çalıştığını, 304 yanıtının maliyetini ve hangi direktifin hangi durumda seçilmesi gerektiğini açıklar.
  5. Web Vitals RUM ve Lab Data Farkı Nedir? Gerçek kullanıcı ölçümü ile lab verisi arasındaki yapısal farkı, CrUX ve Lighthouse'un neden farklı sonuçlar ürettiğini açıklar.
  6. Lighthouse ile Hangi Sorun Gerçekten Öncelikli? Lighthouse puanının nasıl yanıltıcı bir hedef haline geldiğini ve hangi metriklerin gerçek kullanıcı deneyimini yansıttığını açıklar.
  7. Web Worker ile Main Thread'i Boşaltmak Web Worker'ın main thread'den bağımsız nasıl çalıştığını, postMessage ile veri aktarımını ve DOM koordinasyonunu açıklar.
  8. Main Thread Blocking Nedir? Long task'ların main thread'i nasıl bloke ettiğini, TBT metriğini ve görevleri bölmenin pratik yollarını açıklar.
  9. JavaScript Parse ve Execute Maliyeti Nedir? JavaScript dosyalarının parse ve execute aşamalarında main thread'e bindirdiği maliyeti, ölçüm yöntemlerini ve azaltma stratejilerini açıklar.
  10. Self-Hosted Font Kullanmak Daha mı Hızlı? Google Fonts ve self-hosted yaklaşımının gerçek hız farkını, cache stratejisini ve WOFF2 kurulumunu karşılaştırır.
  11. Google Fonts Performansı Nasıl İyileştirilir? İstek zinciri, varyasyon yükü ve `display` tercihleri üzerinden Google Fonts kurulumunu nasıl sadeleştireceğinizi açıklar.
  12. Font Yükleme Optimizasyonu Nasıl Yapılır? Görünür metni bekletmeden font seçimlerini, varyasyon yükünü ve fallback davranışını nasıl yöneteceğinizi anlatır.
  13. Defer ve Async Arasındaki Fark Nedir? Scriptlerin ne zaman çalıştırıldığını, sıranın neden bozulduğunu ve hangi durumda hangisinin daha güvenli olduğunu açıklar.
  14. Preload ve Prefetch Farkı Nedir? Kaynak önceliğinde “şimdi gerekli” ile “yakında gerekebilir” ayrımını ve yanlış hint kullanımının riskini açıklar.
  15. Critical CSS Nedir? İlk Boyama Süresi Nasıl Kısalır? İlk ekran için gerçekten gerekli stilleri ayırıp fazla kritik CSS'in neden ters etki üretebildiğini anlatır.
  16. Dynamic Import Nedir? Ne Zaman Kullanılmalı? Ağır modüllerin ne zaman ertelenebileceğini ve yanlış zamanlamanın ilk etkileşimde nasıl yeni bekleme ürettiğini açıklar.
  17. Tree Shaking Nedir? Kullanılmayan Kod Nasıl Düşer? Kullanılmayan export'ların neden bazen düşmediğini ve hangi import alışkanlıklarının paketi gereksiz büyüttüğünü ayırır.
  18. Bundle Analizi Nasıl Yapılır? Hangi Paket Şişiriyor? Build çıktısında hangi modülün gerçekten ilk paketi büyüttüğünü ve tekrar eden yükleri nasıl ayıracağınızı gösterir.
  19. TTFB Nedir? Sunucu Yanıt Süresi Nasıl İyileştirilir? İlk byte gecikmesini oluşturan uygulama, veritabanı, yönlendirme ve cache katmanlarını ayırır.
  20. INP Nedir? Etkileşim Gecikmesi Nasıl Düşürülür? Tıklama ve dokunma anlarında arayüzü ağırlaştıran JavaScript, uzun görev ve boyama yükünü ayırır.
  21. PageSpeed Insights Nedir? Puan Nasıl Yükseltilir? Raporu doğru okumak, puan yerine gerçek darboğazlara odaklanmak ve iyileştirme sırasını kurmak.
  22. Core Web Vitals Nedir? LCP, CLS ve INP Rehberi Google'ın izlediği üç temel deneyim metriğini sade dille okuyup hangi sorunun neyi bozduğunu ayırma.
  23. LCP Nedir? En Büyük İçerik Nasıl Hızlanır? Kahraman görsel, başlık bloğu ve sunucu gecikmesi yüzünden uzayan ilk güçlü görünümü toparlama yolları.
  24. CLS Nedir? Sayfa Kaymaları Nasıl Önlenir? Geç yüklenen görseller, reklam alanları ve sonradan açılan bileşenlerin düzeni neden bozduğunu örneklerle anlatır.
  25. Lazy Loading Nedir? Neyi Ertelemek Mantıklı? Ekran dışı görselleri ve iframe'leri erteleyip hero alanını neden buna dahil etmemek gerektiğini açıklar.
  26. Render Engelleyen Kaynaklar Nasıl Azaltılır? İlk boyamayı tutan CSS ve senkron JavaScript yüklerini nasıl ayıklayıp daha akıcı başlangıç elde edebileceğinizi özetler.
  27. CSS ve JavaScript Dosyaları Nasıl Küçültülür? Minify, sıkıştırma ve üretim çıktısını sadeleştirme adımlarını bakım tarafını bozmadan ele alır.
  28. Kullanılmayan CSS ve JS Nasıl Temizlenir? Projeye yıllar içinde eklenen ama artık çalışmayan katmanları güvenli biçimde tespit etme yaklaşımı.
  29. Tarayıcı Önbellekleme Nasıl Yapılır? HTML ile statik dosyaları aynı kuralla önbelleğe koymanın neden sorun çıkardığını pratik örneklerle gösterir.
  30. Code Splitting Nedir? Bundle Boyutu Nasıl Azalır? Tek parça paket yerine ihtiyaç anında yüklenen modüllerle ilk açılışı hafifletme mantığını anlatır.