Tarayıcı Önbelleklemenin Temel Mantığı
Tarayıcı önbellekleme, bir web sayfasını oluşturan dosyaların (HTML, CSS, JS, yazı tipi, SVG ve benzeri) kullanıcının cihazında belirli bir süre saklanması ve tekrar ihtiyaç duyulduğunda ağ yerine bu yerel kopyaların kullanılması prensibine dayanır. Bu yaklaşım, ağ gecikmesini ve bant genişliği tüketimini azaltır; özellikle tekrarlayan ziyaretlerde, ilk bayttanilk içeriğe kadar geçen süreleri kısaltarak algılanan hızda ciddi iyileşme sağlar. Temel soru şudur: Hangi varlığı, ne kadar süre ve hangi koşulda yerelde tutacağım? Yanıt, varlığın değişme sıklığı, kritikliği ve kullanıcı bağlamına göre şekillenir.
Önbellek davranışı çoğunlukla HTTP başlıklarıyla yönetilir. Cache-Control ile bir varlığın maksimum saklama süresi (ör. max-age=31536000) ve aracı önbelleklerin (CDN, kurumsal proxy) kullanım hakları (ör. public / private) belirlenir. İçerik sık değişiyorsa no-store veya çok kısa max-age değerleri seçilir; daha sürdürülebilir yaklaşım ise koşullu doğrulamadır. Sunucu, yanıtla birlikte bir ETag (içerik parmak izi) veya Last-Modified (değişim tarihi) döndürür; tarayıcı bir sonraki istekte bu değerleri iletir. Eğer içerik değişmediyse sunucu 304 Not Modified döndürür ve veri yeniden indirilmez.
En yüksek verim, dosya adında versiyonlama (fingerprinting) ve uzun süreli önbelleklemenin birleşiminden doğar. Örneğin app.9f3c1.js gibi hash’li bir dosya, Cache-Control: public, max-age=31536000, immutable ile bir yıl saklanabilir. İçerik değiştiğinde derleme yeni bir hash üretir; tarayıcı eskiyi kullanmayı sürdürürken yeni sayfalar yeni dosyayı referans alır. Böylece hem tazelik hem hız korunur. HTML ise genellikle kısa süreli veya hiç önbelleklenmez; çünkü HTML, diğer varlıkların referansını (manifest) taşır ve sayfa düzeni/icerik değişikliklerini yansıtmalıdır.
İlkelerle Hız: Kısa Rehber
“Statik varlıklar uzun, HTML kısa ve doğrulamalı.” Bu basit eşleşme, tipik sitelerde kullanıcıların %70+’ının ikinci ziyaret hızını dramatik biçimde iyileştirir.
Tekrar Ziyarette Sıçrama
Tarayıcı diski ve bellek önbelleği, kritik CSS/JS’yi ağ yerine yerelden getirerek LCP ve FCP değerlerini düşürür.
Sunucu Yükünü Azaltır
Önbellekten hizmet edilen varlıklar, kök sunucu ve uygulama katmanındaki gereksiz istekleri engeller.
Daha Az Bant Genişliği
Ağ trafiği düşer; özellikle mobil kullanıcılar ve sınırlı veri paketlerinde deneyim iyileşir.
Tipik Politika Haritası
- HTML:
Cache-Control: no-cache+ETag(veyaLast-Modified) - CSS/JS hash’li:
public, max-age=31536000, immutable - Webfont/SVG: Uzun süreli cache + CORS başlıkları
- API JSON: Kısa
max-age+ koşullu doğrulama
Bu harita, çoğu modern site için güvenli bir başlangıç noktasıdır.
Not: Önbellek davranışı kullanıcı oturumuna, kimlik doğrulamaya ve gizlilik politikalarına göre değişebilir. Gizli içerikler için private ve uygun kimlik kontrolleri şarttır.
Static Asset (CSS, JS, Görseller) Önbellekleme Ayarları
Statik varlıkların doğru önbelleklemesi, performans mühendisliğinin omurgasıdır. Hedef; içerik bütünlüğünü korurken mümkün olan en uzun saklama süresini tanımlamaktır. Bunun için üç parçalı bir strateji uygulanır: (1) Dosya adı versiyonlama ile içerik değişimini tespit edilebilir kılmak, (2) agresif cache başlıkları ile tekrarlayan ağ isteklerini önlemek, (3) doğru varyasyon tanımlarıyla (ör. Vary: Accept-Encoding) farklı istemci yeteneklerine uygun kopyalar sunmak.
CSS/JS tarafında hash’li derleme çıktıları kullanmak en sağlam yöntemdir. app.[contenthash].css ve app.[contenthash].js gibi adlar, içerik değişmeden dosya adının sabit kalmasını, değiştiğinde ise otomatik güncellenmesini sağlar. Böylece bu dosyalara Cache-Control: public, max-age=31536000, immutable verilebilir. immutable, tarayıcıya dosyanın aynı URL altında asla değişmeyeceğini söyler; tarayıcı yeniden doğrulama yapmaz, doğrudan diskten okur.
Görsellerde ise iki ek parametre önemlidir: içerik türü ve boyut/format varyasyonları. Hizmet ettiğiniz formatlar (WebP, AVIF, JPEG) ve piksel yoğunluklarına göre (1x/2x) farklı dosyalar üretmek gerekebilir. Bu durumda, istemci yeteneklerine göre seçim yapan bir responsive images yapısı (ör. <img srcset>) kurarken, her varyantı da uzun süreli önbellekleyin. CDN veya origin, Vary: Accept ya da Vary: User-Agent başlıklarını yönetebilmeli; aksi halde farklı istemcilere yanlış kopya döndürülebilir.
Önerilen Başlıklar (Statik Varlıklar)
Cache-Control: public, max-age=31536000, immutableETag(opsiyonel; immutable ile çoğu kez gereksiz)Vary: Accept-Encoding(gzip/br/zstd gibi sıkıştırmalar için)Content-TypeveContent-Encodingdoğru ayarlı
Hash’li varlıklarda uzun süreli cache; hash’sizlerde kısa süreli + koşullu doğrulama tercih edilir.
CSS İçin İpuçları
Kritik CSS’yi satır içi (inline critical CSS) verip geri kalanını ertelenmiş yükleyin. Kritik CSS inline olduğunda, dosya boyutu küçük kaldığı sürece HTML ile birlikte gelir ve ilk boyamada hız kazandırır. Geri kalan CSS ise hash’li ve uzun önbellekli olsun.
JS İçin İpuçları
Modül tabanlı ayrıştırma (code-splitting) ile yalnızca gerekli bundle’ları yükleyin. Her parçayı hash’leyin, defer ile yürütmeyi erteleyin ve uzun süreli cache uygulayın.
Görseller İçin İpuçları
CDN’de otomatik format dönüştürme ve origin shield kullanın. Küçük ikonları mümkünse SVG’ye çevirin; SVG’ler de hash’li adlarla uzun süreli önbelleklenebilir.
Dağıtım Boru Hattı (Pipeline) Notu
Derleme çıktısında dosya adları hash’lenir, HTML/manifest referansları güncellenir, CDN’ye upload edilir ve yalnızca HTML kısa cache’le yayına alınır. Böylece kullanıcılar yeni HTML ile birlikte yeni hash’li varlıkları hemen görür.
Dikkat: Üçüncü taraf script’ler çoğu kez hash/versiyonlama kontrolünüz dışında kalır. Bu kaynakları mümkünse self-host edin veya Subresource Integrity (SRI) ile bütünlük sağlayın; cache başlıklarını da kendi CDN’inizden yönetin.
HTTP Cache-Control ve ETag Kullanımı
HTTP önbellekleme stratejilerinin bel kemiğini Cache-Control ve ETag başlıkları oluşturur. Cache-Control, istemci ve ara önbellekler için dosyanın ne kadar süre saklanacağını ve hangi koşullarda kullanılacağını tanımlar. ETag ise dosyanın bütünlüğünü temsil eden benzersiz bir içerik imzasıdır. Bu ikili, birlikte kullanıldığında hem performans hem de içerik tazeliği açısından dengeli bir yapı sağlar.
Cache-Control başlığında en sık kullanılan parametrelerden biri max-age’dir. Bu değer, dosyanın kaç saniye boyunca yeniden indirilmeden kullanılabileceğini belirtir. public ve private parametreleri, önbelleğin paylaşılabilirliğini belirler. Örneğin, herkese açık bir CSS dosyası public olarak işaretlenebilirken, kullanıcıya özel bir PDF dosyası private olmalıdır. no-store tamamen önbelleği devre dışı bırakır, no-cache ise doğrulama yapılmadan kullanılmamasını sağlar.
ETag başlığı, sunucunun dosyaya verdiği benzersiz bir kimliktir. İstemci, daha önce aldığı ETag değerini If-None-Match başlığı ile geri gönderir. Sunucu, eğer içerik değişmemişse 304 Not Modified yanıtını döndürür ve veri transferi gerçekleşmez. Bu yaklaşım, özellikle sık değişmeyen ancak tamamen statik de olmayan dosyalar için idealdir.
Cache-Control ve ETag Örnek Kullanımı
- Statik varlıklar:
Cache-Control: public, max-age=31536000, immutable - Dinamik veriler:
Cache-Control: no-cache+ETag - Kullanıcıya özel içerikler:
Cache-Control: private, no-store
Veri Tutarlılığı
ETag, tarayıcı ve sunucu arasında veri bütünlüğünü korur, hatalı veya eski içeriğin görüntülenmesini engeller.
Hızlı Yanıt Süreleri
Koşullu doğrulama ile gereksiz veri transferi önlenir, sayfa yükleme süreleri düşer.
Esnek Konfigürasyon
Cache-Control direktifleri, varlık türüne ve kullanım senaryosuna göre kolayca uyarlanabilir.
Not: Cache-Control ve ETag, HTTP/2 ve HTTP/3 protokollerinde de aynı şekilde çalışır. Ancak, protokol yükseltmesi önbellekleme davranışını değiştirmez.
CDN’in Site Hızına Katkıları
CDN (Content Delivery Network), web sitesinin statik ve dinamik içeriklerini dünya çapına yayılmış edge server noktalarından sunarak kullanıcıya en yakın lokasyondan veri iletilmesini sağlar. Bu yapı, gecikme süresini (latency) düşürür ve sayfa yükleme hızını ciddi oranda artırır. Özellikle küresel hedef kitlesi olan siteler için CDN, performans optimizasyonunun vazgeçilmez bir parçasıdır.
CDN’in site hızına katkısı üç ana faktörde ortaya çıkar: fiziksel yakınlık, yük dengeleme ve önbellekleme. Kullanıcıya coğrafi olarak en yakın sunucu, veriyi daha kısa sürede iletir. Trafik, en az yoğun olan edge noktasına yönlendirilerek tıkanıklık önlenir. Statik varlıklar edge önbelleğinde tutulur ve tekrar isteklerde direkt olarak buradan sunulur.
Bir diğer avantaj ise ağ optimizasyonudur. CDN’ler, veriyi sıkıştırarak (gzip, brotli) ve HTTP/2 veya HTTP/3 üzerinden çoklu istekleri aynı bağlantıda yürüterek transfer süresini kısaltır. Ayrıca, hot cache dediğimiz, sık talep gören varlıkların RAM tabanlı önbelleklerde tutulması, ilk bayta kadar geçen süreyi milisaniyelere indirir.
CDN Avantajları Özet
- Gecikme süresini düşürür
- Sunucu yükünü azaltır
- Ağ trafiğini optimize eder
- Yüksek erişilebilirlik sağlar
Küresel Erişim
CDN, içeriğinizi dünyanın her köşesine düşük gecikmeyle ulaştırır.
Anında Yükleme
Önbellekten sunulan statik dosyalar, milisaniyeler içinde yüklenir.
Güvenlik Entegrasyonu
CDN sağlayıcıları, DDoS koruması ve SSL yönetimini entegre sunar.
Performans Ölçümü
CDN öncesi ve sonrası sayfa yükleme sürelerini karşılaştırmak için WebPageTest veya Lighthouse kullanın. Ölçüm sonuçları, yatırımın etkisini net olarak gösterir.
CDN Sağlayıcı Seçerken Dikkat Edilecek Kriterler
CDN seçimi, yalnızca fiyat karşılaştırmasına dayanan bir karar değildir; performans, güvenlik, ölçeklenebilirlik ve teknik uyumluluk gibi birçok faktör dikkate alınmalıdır. Özellikle geniş coğrafi hedef kitleye sahip siteler, CDN’in sunduğu PoP (Point of Presence) sayısı ve dağılımına göre ciddi hız farkları yaşayabilir. Türkiye merkezli bir e-ticaret sitesi için Avrupa, Orta Doğu ve Kuzey Afrika bölgelerinde güçlü edge varlığı olan bir sağlayıcı öncelikli tercih olmalıdır.
İlk değerlendirme kriteri, PoP kapsaması ve gecikme testleridir. Sağlayıcının sunduğu ağ haritası, hedef kitlenizin bulunduğu bölgelerde yeterli sayıda ve stratejik olarak konumlandırılmış olmalıdır. Latency test sonuçları, milisaniye seviyesinde fark yaratabilir. İkinci önemli konu, cache hit ratio performansıdır. Yüksek hit ratio, daha az origin isteği ve daha düşük sunucu yükü demektir.
Üçüncü kriter ise fiyatlandırma ve trafik politikaları. Bazı CDN’ler “pay-as-you-go” modeli ile çalışırken, bazıları sabit paketler sunar. Ayrıca, çıkış trafiği (egress) ücretleri bölgesel olarak değişebilir. Kullanım alışkanlıklarınıza göre doğru model seçilmelidir. Son olarak, ek özellikler (DDoS koruması, WAF, SSL yönetimi, bot filtreleme, görüntü optimizasyonu) sağlanıp sağlanmadığı da göz önünde bulundurulmalıdır.
CDN Seçiminde Temel Sorular
- Hedef bölgelerde kaç adet ve nerelerde PoP var?
- Ortalama gecikme süreleri nedir?
- Cache hit oranı ne seviyede?
- Ek güvenlik ve optimizasyon özellikleri mevcut mu?
- Fiyatlandırma modeli kullanımınıza uygun mu?
PoP Konumu
Hedef pazarlarınıza yakın PoP noktaları, gecikme süresini minimize eder.
Hit Oranı
Yüksek cache hit oranı, sunucuya binen yükü ve veri transfer maliyetlerini azaltır.
Güvenlik
Entegre WAF ve DDoS koruması, performansla birlikte güvenliği de artırır.
İpucu: CDN seçimi öncesinde 7-14 günlük deneme süresi talep edin ve gerçek kullanıcı verileriyle test yapın.
Edge Server Konumlandırmasıyla Gecikme Süresini Azaltma
Edge server’lar, kullanıcı ile origin sunucu arasındaki fiziksel mesafeyi kısaltarak verinin daha hızlı iletilmesini sağlar. Gecikme süresi (latency), genellikle milisaniye ile ölçülür ve kullanıcı deneyimi üzerinde doğrudan etkilidir. Özellikle yüksek trafik alan uluslararası sitelerde, doğru konumlandırılmış edge noktaları sayfa yükleme sürelerini dramatik biçimde iyileştirir.
Edge konumlandırması, hedef pazar analizine dayalı olmalıdır. Örneğin, ziyaretçilerinizin %40’ı Avrupa’dan, %35’i Orta Doğu’dan geliyorsa, PoP noktalarının bu bölgelerde yoğunlaştırılması gerekir. Ayrıca, anycast routing teknolojisi ile kullanıcı isteği en yakın edge noktasına otomatik olarak yönlendirilir. Bu yapı, hem performansı hem de kesintisiz hizmet sürekliliğini destekler.
Gecikme süresini azaltmanın diğer bir yolu ise origin shield kullanımıdır. Origin shield, edge noktaları ile ana sunucu arasında ek bir önbellek katmanı işlevi görür. Bu, origin üzerindeki yükü azaltır ve özellikle çok sayıda edge noktasının aynı anda origin’e talepte bulunduğu durumlarda verimlilik sağlar.
Edge Konumlandırma Stratejileri
- Hedef pazarlara yakın PoP seçimi
- Anycast yönlendirme kullanımı
- Origin shield entegrasyonu
- Gecikme testlerinin düzenli yapılması
Coğrafi Yakınlık
En yakın PoP noktası üzerinden içerik sunmak, milisaniyelerle ölçülen avantaj sağlar.
Akıllı Yönlendirme
Anycast routing, en düşük gecikme süresine sahip rotayı otomatik olarak seçer.
Origin Shield
Ana sunucuya yapılan istekleri filtreleyerek yük dengesini sağlar ve yanıt sürelerini kısaltır.
Performans Testleri
Edge konumlandırma değişikliklerinden sonra, real user monitoring (RUM) ve synthetic monitoring araçları ile ölçüm yaparak değişikliğin etkisini doğrulayın.
Dinamik İçeriklerde CDN Kullanım Teknikleri
CDN’ler genellikle statik varlıklar için bilinse de, gelişmiş yapılandırmalarla dinamik içeriklerde de yüksek performans sağlar. Dinamik içerik, kullanıcının talebine göre gerçek zamanlı oluşturulan veridir; örneğin kullanıcıya özel hesap sayfası, sepet içerikleri veya canlı skor tabloları. Bu içerikler doğrudan önbelleğe alınmaz, ancak “akıllı” CDN kuralları ile yanıt süresi azaltılabilir.
Dinamik içeriklerde CDN kullanımının en yaygın yöntemi, Edge Side Includes (ESI) teknolojisidir. ESI, sayfanın değişmeyen bölümlerini önbellekten sunarken değişken kısımlarını origin sunucudan çeker. Böylece, hem hız korunur hem de kişiselleştirme yapılır. Bir diğer yöntem ise API caching ile belirli sorguların kısa süreli tutulmasıdır. Örneğin, döviz kuru veya hava durumu verileri 30–60 saniyelik TTL ile CDN önbelleğinde saklanabilir.
WebSocket ve HTTP/2 push gibi sürekli bağlantı gerektiren senaryolarda CDN, sadece bağlantının optimizasyonunu sağlar; veri yine origin üzerinden akar. Ancak CDN’nin sunduğu TCP optimizasyonu, protocol negotiation ve connection reuse yetenekleri gecikmeyi düşürür.
Dinamik CDN Kullanımında Öne Çıkan Yöntemler
- ESI ile sayfa parçalama ve kısmi önbellekleme
- Kısa TTL ile API yanıtlarını cache’leme
- TCP optimizasyonu ve HTTP/2 push
- Coğrafi yönlendirme ile en yakın origin seçimi
ESI ile Parçalı Sunum
Sabit öğeler (header, footer) CDN’den gelirken, dinamik alanlar anlık olarak yüklenir.
Kısa Süreli API Cache
Hızlı değişen veriler için bile saniyelerle ölçülen önbellek iyileştirme sağlar.
Coğrafi Akıllı Yönlendirme
Kullanıcıyı en yakın ve en hızlı origin’e bağlar, gecikmeyi azaltır.
Öneri
Dinamik içeriklerde CDN kullanırken, cache key yapılandırmasını dikkatle belirleyin. Kullanıcı oturum bilgisi veya dil parametresi gibi değişkenler, önbellekten yanlış içerik sunulmasına yol açabilir.
Önbellek Temizleme (Cache Purge) ve Güncelleme Süreçleri
Önbellek temizleme, güncellenmiş veya hatalı içeriklerin kullanıcılara eski haliyle ulaşmasını önlemek için kritik bir adımdır. CDN veya tarayıcı önbelleğinde saklanan veriler, içerik değiştiğinde manuel veya otomatik olarak temizlenmelidir. Bu işlem “purge” olarak adlandırılır ve farklı seviyelerde uygulanabilir: tekil dosya, dizin, ya da tüm önbellek.
Purge sürecinin başarısı, güncelleme mekanizmanızla entegre çalışmasına bağlıdır. Modern dağıtım boru hatlarında (CI/CD), kod veya içerik yayına alındığında CDN API’si aracılığıyla otomatik purge tetiklenir. Böylece, geliştiriciler veya içerik yöneticileri manuel müdahale yapmak zorunda kalmaz.
Purge işlemlerinde dikkat edilmesi gereken nokta, aşırı kullanımın performansı olumsuz etkilemesidir. Tüm önbelleğin temizlenmesi, edge noktalarının origin’den tekrar veri çekmesine neden olur ve ilk ziyaretlerde gecikme yaşanır. Bu nedenle, yalnızca değişen varlıkları hedefleyen soft purge veya purge by URL yöntemleri tercih edilmelidir.
Otomatik Purge
CI/CD entegrasyonu ile yayın sonrası önbellek temizliği otomatikleşir.
Seçici Temizlik
Yalnızca değişen dosyalar temizlenir, performans kaybı önlenir.
Güvenli Güncelleme
Yanlışlıkla eski veya hatalı içeriğin kalıcı olarak yayında kalmasını engeller.
Dikkat: Purge sonrası ilk ziyaretlerde küçük hız düşüşleri normaldir. Bu, önbelleğin yeniden dolması sürecidir.
CDN ile Güvenlik (DDoS Koruma, SSL) Avantajları
CDN’ler yalnızca hız ve performans sağlamaz; aynı zamanda güvenlik altyapınızı da güçlendirir. Özellikle yüksek trafikli web siteleri ve e-ticaret platformları, DDoS saldırıları, veri ihlalleri ve kötü niyetli bot trafiğine karşı savunmasızdır. CDN’ler, küresel ağ yapıları ve gelişmiş güvenlik protokolleri sayesinde bu tehditleri minimize eder.
En yaygın güvenlik avantajlarından biri DDoS korumasıdır. CDN sağlayıcıları, trafik dalgalanmalarını dağıtarak ve saldırı trafiğini filtreleyerek sitenizin kesintiye uğramasını önler. Ayrıca WAF (Web Application Firewall) entegrasyonu ile SQL injection, XSS gibi yaygın web saldırılarına karşı ek koruma sunar.
SSL/TLS sertifika yönetimi de CDN’lerin güçlü olduğu bir alandır. Pek çok CDN, kendi üzerinden Let's Encrypt veya özel sertifikalarla HTTPS’yi kolayca etkinleştirmenize olanak tanır. Bu sayede, verilerin tarayıcı ile sunucu arasındaki iletimi şifrelenir ve kullanıcı güveni artar.
Gerçek Zamanlı DDoS Koruma
CDN ağı, saldırı trafiğini yayarak ve filtreleyerek kesintisiz hizmet sağlar.
Şifreli İletişim
SSL/TLS ile veri akışı güvence altına alınır, kullanıcı güveni artar.
Bot Filtreleme
Kötü niyetli botlar engellenir, yalnızca gerçek kullanıcı trafiği işlenir.
Ekstra İpucu
CDN sağlayıcınızın sunduğu güvenlik raporlarını düzenli olarak inceleyin. Bu raporlar, saldırı türleri ve sıklıkları hakkında kritik veriler sunar.
