Statik öğeleri verimli bir önbellek politikasıyla yayınlama

HTTP önbelleğe alma, tekrarlanan ziyaretlerde sayfa yüklenme süresini kısaltabilir.

Tarayıcı bir kaynak isteğinde bulunduğunda, kaynağı sağlayan sunucu, tarayıcıya kaynağı geçici olarak ne kadar süreyle depolaması veya önbelleğe alması gerektiğini bildirebilir. Tarayıcı, bu kaynağa yönelik sonraki isteklerde kaynağı ağdan almak yerine yerel kopyasını kullanır.

Lighthouse önbellek politikası denetimi nasıl başarısız oluyor?

Lighthouse, önbelleğe alınmayan tüm statik kaynakları işaretler:

Verimli önbellek politikası denetimiyle Lighthouse Sunum statik öğelerinin ekran görüntüsü

Aşağıdaki tüm koşullar karşılanırsa Lighthouse bir kaynağı önbelleğe alınabilir olarak kabul eder:

  • Kaynak bir yazı tipi, resim, medya dosyası, komut dosyası veya stil sayfası olmalıdır.
  • Kaynağın 200, 203 veya 206 HTTP durum kodu vardır.
  • Kaynağın açık bir önbellek kullanma politikası yok.

Bir sayfa denetimde başarısız olduğunda Lighthouse, sonuçları üç sütunlu bir tabloda listeler:

URL Önbelleğe alınabilir kaynağın konumu
TTL'yi önbelleğe alma Kaynağın mevcut önbellek süresi
Aktarım Boyutu İşaretli kaynak önbelleğe alınmışsa kullanıcılarınızın kaydedeceği verilere ilişkin bir tahmin

HTTP önbelleğe alma yöntemini kullanarak statik kaynakları önbelleğe alma

Sunucunuzu Cache-Control HTTP yanıt başlığını döndürecek şekilde yapılandırın:

Cache-Control: max-age=31536000

max-age yönergesi, tarayıcıya kaynağı saniye cinsinden ne kadar süreyle önbelleğe alması gerektiğini bildirir. Bu örnekte süre, 1 yıla karşılık gelen 31536000 olarak ayarlanır: 60 saniye × 60 dakika × 24 saat × 365 gün = 31536000 saniye.

Sabit statik öğeleri bir yıl veya daha uzun süre gibi uzun bir süre boyunca önbelleğe almanız gerekir.

Kaynak değiştiyse ve güncellik önemliyse no-cache kullanın. Yine de önbelleğe almanın bazı hız avantajlarından yararlanmak istiyorsanız bu seçeneği kullanın. Tarayıcı, no-cache olarak ayarlanmış bir kaynağı önbelleğe almaya devam eder ancak kaynağın hâlâ güncel olduğundan emin olmak için önce sunucuyla kontrol eder.

Daha uzun bir önbellek süresi her zaman daha iyi değildir. Sonuç olarak, kaynaklarınız için optimum önbellek süresinin ne olduğuna karar vermek size kalmıştır.

Tarayıcının farklı kaynakları önbelleğe alma şeklini özelleştirmek için pek çok yönerge vardır. Kaynakları önbelleğe alma hakkında daha fazla bilgi edinmek için HTTP önbelleği: ilk savunma satırı rehberiniz ve HTTP önbelleğe alma davranışını yapılandırma codelab bölümüne bakın.

Chrome Geliştirici Araçları'nda önbelleğe alınan yanıtları doğrulama

Tarayıcının önbelleğinden hangi kaynakları aldığını görmek için Chrome Geliştirici Araçları'nda sekmesini açın:

[comment]: <> (Aşağıdaki liste web.dev'den bir kısa koddu, ancak İngilizceden hiçbir dile çevrilmemiştir.) 1. Geliştirici Araçları'nı açmak için Control+Shift+J (veya Mac'te Command+Option+J) tuşuna basın. 2. sekmesini tıklayın.

Chrome Geliştirici Araçları'ndaki Boyut sütunu, bir kaynağın önbelleğe alındığını doğrulamanıza yardımcı olabilir:

Boyut sütunu.

Chrome, önbellekten en çok istenen kaynakları sunar. Bu önbellek çok hızlıdır ancak tarayıcı kapatıldığında temizlenir.

Bir kaynağın Cache-Control üst bilgisinin beklendiği gibi ayarlandığını doğrulamak için HTTP üst bilgisi verilerini kontrol edin:

  1. İstekler tablosunun Ad sütununun altında isteğin URL'sini tıklayın.
  2. Üstbilgiler sekmesini tıklayın.
Üstbilgiler sekmesi aracılığıyla Cache-Control üstbilgisini inceleme
Başlıklar sekmesi aracılığıyla Cache-Control üst bilgisini inceleme.

Yığına özel rehberlik

Drupal

Yönetim > Yapılandırma > Geliştirme sayfasında Tarayıcı ve proxy önbelleği maksimum yaşı'nı ayarlayın. Drupal performans kaynakları sayfasına bakın.

Joomla

Önbellek başlıklı makaleyi inceleyin.

WordPress

Tarayıcı Önbelleğine Alma bölümüne bakın.

Kaynaklar