Tarayıcı Önbelleğine Alma Özelliğinden Yararlanma

Bu kural, PageSpeed Insights, sunucunuzdan gelen yanıtta açıkça önbelleğe alınmış üstbilgiler olmadığını veya kaynakların sadece kısa bir süre için önbelleğe alınacak biçimde belirtildiğini algıladığında tetiklenir.

Genel Bakış

Statik kaynakların tarayıcı önbelleğine alınması, kullanıcıya sitenizi birden fazla defa ziyaret ettiği durumda zaman kazandırabilir. Üstbilgileri önbelleğe alma, sadece resimler gibi küçük bir alt kümeye değil, önbelleğe alınabilecek tüm statik kaynaklara uygulanmalıdır. Önbelleğe alınabilecek kaynaklar arasında JS ve CSS dosyaları, resim dosyaları ve diğer ikili nesne dosyaları (medya dosyaları, PDF'ler vb.) bulunur. Genelde HTML statik değildir ve varsayılan olarak önbelleğe alınabileceği düşünülmemelidir. Önbelleğe alma politikalarından hangisinin sitenizin HTML'siyle sorunsuz çalışacağı üzerinde düşünmeniz gerekir.

Öneriler

Sunucunuzda, tarayıcı önbelleğine almayı etkinleştirin. Statik kaynakların önbellekte kalma ömrü en az bir hafta olmalıdır. Reklamlar veya widget'lar gibi üçüncü taraf kaynaklarının ise en az bir günlük bir önbellekte kalma ömrü olmalıdır. Önbelleğe alınabilecek tüm kaynaklar için aşağıdaki ayarları öneririz:

  • Expires değerini en az bir hafta olarak belirleyin, hatta bir yıla kadar belirlemeniz tercih edilir. (Expires daha yaygın olarak desteklendiğinden, Cache-Control: max-age yerine onu tercih ediyoruz.) Bu değeri bir yıldan daha fazla olarak belirlemeyin. Bu durum, RFC yönergelerini ihlal eder.
  • Bir kaynağın ne zaman değişeceğini tam olarak biliyorsanız daha kısa bir son kullanma tarihi de belirlenebilir. Ancak, "yakında değişebileceğini" ama bunun ne zaman olacağını bilmiyorsanız, uzun bir son kullanma tarihi ayarlamanız ve URL dijital parmak izi (aşağıda açıklanmıştır) kullanmanız gerekir.

Expires ve Cache-Control: max-age üstbilgileri

Bu üstbilgiler, tarayıcının önbellekte bulunan bir kaynağı, web sunucusundan yeni bir sürümün olup olmadığını kontrol etmeden kullanabileceği süreyi belirtir. Bunlar, koşulsuz olarak uygulanan "güçlü önbelleğe alma üstbilgileridir". Bu üstbilgiler ayarlandıktan ve kaynak indirildikten sonra, son kullanma tarihine veya maksimum yaşa erişilinceye ya da önbellek kullanıcı tarafından silininceye kadar tarayıcı, kaynak için herhangi bir GET isteği göndermez.

Last-Modifed ve ETag üstbilgileri

Bu üstbilgiler, tarayıcının dosyaları önbelleğe alırken bunların aynı olup olmadıklarını nasıl belirlemesi gerektiğini belirtir. Last-Modified üstbilgisinde bu bir tarihtir. ETag üstbilgisinde ise, bir kaynağı benzersiz olarak belirleyen herhangi bir değer olabilir (tipik olarak dosya sürümleri veya içerik karmaları). Last-Modified "zayıf" bir önbelleğe alma üstbilgisidir, çünkü tarayıcı, öğeyi önbellekten alıp almamayı belirlerken zamana dayalı bir mantık uygular.

Bu üstbilgiler, kullanıcı, sayfayı açıkça yeniden yüklediğinde koşullu GET istekleri göndererek tarayıcının önbelleğe alınmış olan kaynaklarını verimli bir biçimde güncellemesini sağlar. Koşullu GET'ler kaynak, sunucuda değişmedikçe tam yanıt döndürmezler. Böylece, tam GET'lere göre daha düşük bir gecikmeleri bulunur.

Hangi önbelleğe alma üstbilgilerini kullanmalıyım?

Önbelleğe alınabilecek tüm kaynaklar için Expires veya Cache-Control max-age üstbilgilerinden biri ile Last-Modified veya ETag'dan birini belirlemek önemlidir. Expires ve Cache-Control: max-age üstbilgilerinin her ikisini birden veya Last-Modified ve ETag'in her ikisini birden belirtmek gereksiz fazlalık olur.

URL dijital parmak izini kullanma

Arada bir değişen kaynaklarda, kaynak sunucuda değişinceye kadar tarayıcının bunu önbelleğe almasını sağlayabiliriz. Değişiklik olduğunda, sunucu yeni bir sürümün bulunduğunu tarayıcıya bildirir. Bunu sağlamak için kaynağın her sürümüne benzersiz bir URL verilir. Örneğin, “my_stylesheet.css” adlı bir kaynağımız olduğunu düşünün. Dosyayı “my_stylesheet_fingerprint.css” olarak yeniden adlandırabiliriz. Kaynak değiştiğinde parmak izi de değişir ve böylece URL'si de farklı olur. URL değiştiği zaman tarayıcı da kaynağı yeniden getirmeye zorlanır. Dijital parmak izi uygulaması, daha sık değişen kaynaklar için bile daha ileri bir geleceğe ait son kullanma tarihleri belirlememize olanak sağlar.

Dijital parmak izi oluşturmanın yaygın bir yöntemi, dosya içeriğinin karmasını kodlayan 128 bitlik bir onaltılı sayı kullanmaktır.

Diğer bir strateji ise, uygulamanın her bir yeni sürümü için yeni sürüm dizini oluşturmak ve her bir sürüme ait tüm öğeleri ilgili sürümün dizinine yerleştirmektir. Bu yöntemin dezavantajı, bir öğede sürümler arasında değişiklik olmasa dahi öğenin URL'si değişeceğinden yeniden indirilmesinin zorunlu olmasıdır. İçerik karmalarında bu sorun yaşanmaz, ancak bu yöntem biraz daha karmaşıktır.