Hakkımızda Hizmetler Portfolyo Süreç Backlink Hizmeti Blog İletişim Bölgeler
TR EN RU DE
Projenizi Başlatın

Next.js 15 ile Kurumsal Web Projelerinde Performans Mimarisi

Kurumsal web projelerinde performans, çoğu zaman lansmandan sonra hatırlanan bir konudur. Oysa mimari kararların verildiği ilk hafta, sitenizin üç yıl sonraki hızını belirler. Bu yazıda; Next.js 15 ile kurduğumuz kurumsal projelerde Lighthouse 95+ skorunu standart hâline getiren mimari kararları paylaşıyoruz.

Sunucu bileşenleri: varsayılan tercih

React Server Components (RSC), veri ağırlıklı sayfalarda istemciye giden JavaScript'i dramatik şekilde azaltır. Kuralımız basit: etkileşim yoksa istemciye kod gönderme.

  • Ürün listesi, blog içeriği, footer → sunucu bileşeni
  • Sepet butonu, arama kutusu, filtre paneli → istemci bileşeni

Tipik bir kurumsal sayfada bu ayrım, istemci paketini %40-60 küçültür. Paket küçüldükçe INP (etkileşim gecikmesi) metriği de rahatlar.

Katmanlı önbellekleme stratejisi

Her sayfayı aynı şekilde önbelleklemek, hiç önbelleklememek kadar zararlı olabilir. Önerdiğimiz katmanlar:

1. Statik üretim (SSG) + ISR

Kurumsal sayfalar, blog yazıları ve ürün detayları için: derlemede üret, belirli aralıklarla tazele (revalidate). Ziyaretçi her zaman CDN hızında sayfa alır.

2. Veri katmanı önbelleği

Sık değişmeyen sorgular (menüler, ayarlar, kategori ağaçları) bellek ya da Redis'te. Veritabanına giden her gereksiz sorgu; gecikmenin sessiz ortağıdır.

3. Kişiselleştirilmiş içerik

Kullanıcıya özel bölümler (hesabım, sepet) dinamik kalır — ama sayfanın geri kalanı statik servis edilir. "Tam dinamik sayfa", çoğu zaman tembel mimarinin itirafıdır.

Görseller: sessiz performans katili

Kurumsal sitelerin yük süresinin %60'ı görsellerden gelir. Reçetemiz:

  • AVIF öncelikli format zinciri (AVIF → WebP → JPEG)
  • Görüntü alanına göre responsive boyutlar — 4000px görseli telefona göndermeyin
  • LCP görseline priority, geri kalana loading="lazy"
  • Düzen kaymasına karşı her görsele genişlik/yükseklik

Üçüncü taraf scriptleri dizginlemek

Analitik, pazarlama pikselleri, chat widget'ları… Her biri "sadece 30KB"dır ve toplamda ana iş parçacığını kilitler. Çözüm: script'leri afterInteractive stratejisiyle yükleyin, kullanılmayanları çeyrek bazında temizleyin ve mümkünse sunucu taraflı etiketlemeye geçin.

Ölçüm: laboratuvar değil, saha

Lighthouse laboratuvar verisidir; gerçek kullanıcı deneyimi saha verisinde (CrUX, RUM) görünür. Lansman sonrası gerçek kullanıcı metriklerini izlemeden "site hızlı" demek, hava durumunu pencereden bakmadan tahmin etmektir. SEO bağlantısı için teknik SEO rehberimize de göz atın.

Sonuç

Performans bir özellik değil, mimari bir alışkanlıktır. Sunucu bileşenleri varsayılan, önbellek katmanlı, görseller disiplinli ve üçüncü taraflar dizginliyse — Lighthouse 95+ bir hedef değil, yan etkidir. Kurumsal projenizde bu mimariyi konuşmak için bize ulaşın.

#Next.js#Performans#React

Benzer yazılar