Next.js, 16. sürümünün Beta versiyonunu duyurdu. Ben de bu yazıda, bu sürümde neler değiştiğini kendi anladığım şekilde ve geliştirici gözüyle paylaşmak istedim.
Turbopack: Yeni Default Bundler
Turbopack'in artık hem geliştirme (development) hem de üretim (production) ortamları için varsayılan paketleyici olması, Next.js uygulamaları için kutudan çıktığı anda daha yüksek performans anlamına gelmektedir.
Performans metrikleri, bu geçişle birlikte gelen somut kazanımlar:
- Üretim derlemelerinde 2 ila 5 kat daha hızlı sonuçlar ve fast refresh özelliğinde 10 kata kadar daha hızlı performans.
En güzel kısmıysa şu: hiçbir ek yapılandırma (no config) yapmadan bu performans artışını elde edebiliyoruz. Yine de eski yapılandırmayı (Webpack) tercih edenler için de bir çıkış kapısı bırakılmış: komut satırına --webpack parametresini ekleyerek kolayca Webpack'e geri dönebilirler.
React Compiler: Otomatik Optimizasyon
Bu derleyici, bileşenlerinizi analiz ederek gereksiz yeniden render işlemlerini önler ve performansı artırır. Eskiden performansı artırmak için useMemo veya useCallback hook'larını manuel ekliyorduk. Artık buna gerek kalmadan React Compiler, hangi bileşenin yeniden render edilip edilmeyeceğini kendi belirliyor.
React Compiler henüz varsayılan olarak etkin değildir. Ancak, next.config.js dosyasına eklenecek tek bir flag ile kolayca aktif hale getirilebilir.
// next.config.js
experimental: { reactCompiler: true }
Yeni Caching API'ları
Bu kısımda da dikkatimi çeken şey, Next.js'in veri tutarlılığı (data consistency) konusuna ne kadar odaklandığı oldu. Artık cache yönetimi çok daha esnek ve hedefli hale geliyor.
revalidateTag(): Artık tüm sayfayı değil, sadece belirli bir "etiketlenmiş" bölümü yeniden doğrulayabiliyoruz. Yani bir veriyi güncellediğimizde sadece ilgili bileşen re-render ediliyor. Bu "stale-while-revalidate" mantığıyla çalışıyor; kullanıcı eski veriyi görmeye devam ederken, arka planda yeni veri çekiliyor.updateTag(): Bu sadece Server Actions ile kullanılabiliyor. Farkı şu: güncellemeyi hemen gösteriyor. Kullanıcının anında değişikliği görmesi gereken durumlarda (örneğin profil bilgisi güncellemesi gibi) çok mantıklı.refresh(): Bu da yine sadece Server Actions için. Ancak önbelleğe hiç dokunmuyor. Ben bunu özellikle bildirim veya unread count gibi "canlı" veriler için ideal buldum.
Build Adapters & Routing Geliştirmeleri
Build Adapters API, Next.js'i platform bağımsız hale getiriyor. Artık projeler Cloudflare, AWS, S3 gibi ortamlara kolayca deploy edilebiliyor.
Ayrıca:
- Layout deduplication → Aynı layout'u paylaşan sayfalar artık her prefetch'te yeniden indirilmek yerine, bir kez indiriliyor.
- Incremental prefetching → Next.js artık tüm sayfaları değil, yalnızca önbellekte henüz bulunmayan kısımları önceden getirir.
Sonuç: Daha az ağ trafiği, daha hızlı geçişler.
Cache Components: Partial Prerendering (PPR)
Deneysel PPR bayrağı kaldırılmış ama aslında bu, özelliğin kaybolduğu anlamına gelmiyor. Benim anladığım kadarıyla, Cache Components artık PPR'nin temel mantığını devralıyor. Yani sistem artık bileşen bazında karar veriyor:
- Hangileri statik olarak önbelleklenecek,
- Hangileri dinamik kalacak.
Bu Next.js'in "akıllı rendering" tarafında en önemli adımı.
Next.js artık "build time + request time" verilerini tek bir asenkron zincirde çözmek istiyor.
Yükseltme Notları
- Node.js 20.9+, TypeScript ≥ 5 zorunlu
middleware.js→proxy.jsolarak yeniden adlandırıldırevalidateTag()artık cache profile parametresi istiyor
Daha fazla teknik detay için Next.js'in blog yazısını inceleyebilirsiniz.
Keyifli okumalar!
Bu yazı ilk olarak Medium'da yayınlandı.