Bir ziyaretçi sitenize ikinci kez geldiğinde logo, stil dosyası ve yazı tiplerini yeniden indirmek zorunda kalmamalı. Tarayıcı önbellekleme tam olarak bunu sağlar: sık kullanılan dosyalar ziyaretçinin cihazında saklanır, sayfa daha hızlı açılır, sunucunuz da daha az yük taşır. Doğru yapılandırılmadığında ise ya gereksiz indirmeler sürer ya da güncellemeler ziyaretçiye ulaşmaz.
Önbelleği yöneten başlıklar
Davranışı belirleyen şey, sunucunun yanıtla birlikte gönderdiği HTTP başlıklarıdır. En önemlisi Cache-Control başlığıdır. İçindeki max-age değeri, dosyanın kaç saniye boyunca yeniden sorulmadan kullanılabileceğini söyler. Public ifadesi paylaşımlı önbelleklerin de saklayabileceğini, private ise yalnızca kullanıcının tarayıcısında tutulacağını belirtir. No-store ise hiçbir şeyin saklanmamasını ister ve oturum bilgisi içeren sayfalar için uygundur. ETag ve Last-Modified başlıkları ise doğrulama içindir: süre dolduğunda tarayıcı dosyanın değişip değişmediğini sorar, değişmediyse sunucu kısa bir 304 yanıtı döner ve dosya yeniden indirilmez.
Dosya türüne göre süre belirleme
Tek bir süreyi her dosyaya uygulamak hata olur. Görseller, yazı tipleri ve ikonlar nadiren değişir; bunlar için bir yıl, yani 31536000 saniye makuldür. CSS ve JavaScript dosyalarına da aynı uzun süreyi verebilirsiniz, yeter ki dosya adına sürüm numarası veya içerik özeti ekleyin. Dosya değiştiğinde adı da değiştiği için tarayıcı yeni sürümü hemen indirir. Immutable ifadesini eklemek, süre içinde gereksiz doğrulama isteklerini de engeller. HTML sayfaları için ise kısa süre ya da her seferinde doğrulama tercih edilir; no-cache ifadesi saklamaya izin verir ama kullanmadan önce sunucuya sormayı zorunlu kılar.
Sunucuda uygulama ve test
Apache kullanıyorsanız mod_expires ve mod_headers modülleriyle dosya uzantılarına göre kurallar yazabilirsiniz. Nginx tarafında location bloklarına expires ve add_header satırları eklenir. Bir CDN kullanıyorsanız kendi önbellek süresinin tarayıcı süresinden ayrı ayarlandığını unutmayın. WordPress gibi sistemlerde bu kuralları eklenti ile yönetmek mümkündür, ancak eklentinin ürettiği başlıkları yine de kontrol etmek gerekir.
Ayarları kaydettikten sonra tarayıcının geliştirici araçlarında Ağ sekmesini açın, bir dosyaya tıklayın ve yanıt başlıklarında Cache-Control değerini doğrulayın. Sayfayı ikinci kez yüklediğinizde dosyaların boyut sütununda disk önbelleği veya bellek önbelleği yazması beklenir. Lighthouse ve PageSpeed raporlarındaki verimli önbellek politikası uyarısı da size eksik kalan dosyaları gösterir.
Önbellek ayarı bir kez yapılıp unutulacak bir iş değildir. Yeni dosya türleri eklediğinizde veya dağıtım yönteminizi değiştirdiğinizde kuralları yeniden gözden geçirin; uzun süre, sürümlenmiş dosya adı ve kısa ömürlü HTML üçlüsü çoğu site için sağlam bir başlangıçtır.