SSG (Statik Site Üretimi) Nedir?
Kısa tanım
SSG (Static Site Generation, statik site üretimi), web sayfalarının HTML dosyalarının kullanıcı istek yapmadan önce, derleme (build) sırasında bir kez üretilmesidir. Ortaya çıkan HTML, CSS ve JavaScript dosyaları herhangi bir web sunucusundan veya CDN'den olduğu gibi sunulur; istek anında veritabanı sorgusu ya da render yapılmaz. Bu üretimi yapan araçlara statik site üreteci (static site generator) denir.
Diğer adları: Static Site Generation, statik site üreteci, static site generator, statik render, ön render
Derleme anında ne olur?
Statik üretimde render işi, ziyaretçi gelmeden önce yapılır. İçerik kaynağı Markdown dosyaları, bir headless CMS veya bir API olabilir. Üreteç bu veriyi şablonlarla birleştirir ve her adres için ayrı bir HTML dosyası yazar. Ortaya çıkan klasör doğrudan yayına alınır:
out/
├── index.html
├── hakkimizda/index.html
├── blog/
│ ├── index.html
│ ├── ilk-yazi/index.html
│ └── ikinci-yazi/index.html
├── _assets/app-3c9e1f.js
└── _assets/style-81b0d2.cssBu adım build sürecinin bir parçasıdır ve genellikle CI/CD hattında otomatik çalışır. İçerik ekibi CMS'te bir yazıyı yayımladığında bir webhook yeni bir derlemeyi tetikler; birkaç dakika sonra güncel dosyalar yayına alınmış olur.
Statik site üreteçleri
Bu işi yapan araçların bir kısmı yalnızca statik çıktı için tasarlanmıştır, bir kısmı ise statik üretimi daha geniş bir framework'ün seçeneklerinden biri olarak sunar.
| Araç | Yazıldığı dil | Not |
|---|---|---|
| Hugo | Go | Çok sayıda sayfayı hızlı derlemesiyle bilinir |
| Jekyll | Ruby | Uzun süredir kullanılan, blog odaklı bir üreteç |
| Eleventy | JavaScript | Şablon diline bağlı kalmayan, sade bir yapı |
| Astro | JavaScript | Varsayılan olarak JavaScript'siz HTML üretir |
| Next.js | JavaScript | Statik üretim varsayılan davranışlardan biridir; output: 'export' ile tamamen statik çıktı alınabilir |
Hız, güvenlik ve maliyet
Hazır bir dosyayı sunmak, her istekte veritabanına gidip şablon işlemekten her zaman daha hızlıdır. Dosyalar bir CDN üzerinden kullanıcıya yakın noktalardan sunulduğunda TTFB genellikle çok düşük kalır. İstek anında çalışan bir uygulama sunucusu ve veritabanı bağlantısı olmadığı için saldırı yüzeyi küçülür; trafik aniden artsa bile ölçeklemek büyük ölçüde CDN'in işidir. Barındırma maliyeti de buna paralel olarak düşer.
Sınırları: build süresi ve bayat içerik
- Her değişiklik yeni bir derleme ister. Tek bir yazım hatasını düzeltmek için tüm site yeniden üretilir; on binlerce sayfalı bir katalogda bu dakikalar, bazen daha uzun sürer.
- Kişiselleştirme derleme anında yapılamaz. Sepet, kullanıcı adı veya konuma göre fiyat gibi bilgiler ya istemci tarafında JavaScript ile ya da sunucu tarafında ayrı bir katmanla eklenmelidir.
- Dinamik işlevler dış servislere taşınır. Form gönderimi, site içi arama veya yorumlar için bir API ya da üçüncü taraf hizmet gerekir.
Bu sınırlar için geliştirilen ara çözümlerin en bilineni, sayfaları tek tek ve arka planda yeniden üreten ISR'dır.
"Statik" sayfa, etkileşimsiz sayfa demek değildir
Sık yapılan bir yanılgı, statik üretilmiş sitenin JavaScript içeremeyeceğidir. "Statik" yalnızca HTML'in ne zaman üretildiğini anlatır. Derleme anında üretilmiş bir sayfa tarayıcıda hydrate edilerek tamamen etkileşimli hâle gelebilir. Arama motorları açısından ise sonuç sunucu taraflı render ile aynıdır: içerik, başlıklar ve bağlantılar ilk HTML yanıtında hazır bulunur.