Önbelleğe alma genel olarak verileri depolayarak performansı artırabilir. Böylece, aynı verilere yönelik gelecekteki isteklerin daha hızlı sunulması sağlanır. Örneğin, ağdaki önbelleğe alınmış bir kaynak, sunucuya gidiş dönüşü önleyebilir. Önbelleğe alınan bir hesaplama sonucu, aynı hesaplamayı yapmak için gereken zamanı atlayabilir.
Chrome'da önbellek mekanizması çeşitli şekillerde kullanılır. HTTP Önbelleği bunun bir örneğidir.
Chrome'un HTTP Önbelleğinin şu anda çalışma şekli
Sürüm 85'ten itibaren Chrome, ağdan getirilen kaynakları önbellek anahtarı olarak ilgili kaynak URL'lerini kullanarak önbelleğe alır. (Önbellek anahtarı, önbelleğe alınan bir kaynağı tanımlamak için kullanılır.)
Aşağıdaki örnek, tek bir resmin üç farklı bağlamda nasıl önbelleğe alındığını ve işlendiğini gösterir:
![Önbellek Anahtarı: https://x.example/doge.png](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsxexam-d673e1bd1a43f.png?authuser=5&hl=tr)
https://x.example/doge.png
}
Kullanıcı, görüntü (https://x.example/doge.png
) isteyen bir sayfayı (https://a.example
) ziyaret eder. Görüntü, ağdan istenir ve anahtar olarak https://x.example/doge.png
kullanılarak önbelleğe alınır.
![Önbellek Anahtarı: https://x.example/doge.png](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsxexam-f8c1f9f7d95ce.png?authuser=5&hl=tr)
https://x.example/doge.png
}
Aynı kullanıcı başka bir sayfayı (https://b.example
) ziyaret eder ve aynı resmi (https://x.example/doge.png
) ister.
Tarayıcı, bu kaynağın zaten önbelleğe alınıp alınmadığını görmek için
resim URL'sini anahtar olarak kullanıp HTTP önbelleğini kontrol eder. Tarayıcı, Önbelleğinde bir eşleşme bulur. Bu nedenle kaynağın önbelleğe alınmış sürümünü kullanır.
![Önbellek Anahtarı: https://x.example/doge.png](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsxexam-62cac78cd2789.png?authuser=5&hl=tr)
https://x.example/doge.png
}
Resmin bir iFrame içinden yüklenmesi önemli değildir. Kullanıcı, iFrame (https://d.example
) içeren başka bir web sitesini (https://c.example
) ziyaret ederse ve iframe aynı resmi (https://x.example/doge.png
) isterse önbellek anahtarı tüm sayfalarda aynı olduğundan tarayıcı resmi önbelleğinden yükleyebilir.
Bu mekanizma, performans açısından uzun süredir iyi çalışmaktadır. Ancak, bir web sitesinin HTTP isteklerine yanıt vermek için harcadığı süre, tarayıcının geçmişte aynı kaynağa eriştiğini ortaya çıkarabilir ve bu da tarayıcıyı aşağıdakiler gibi güvenlik ve gizlilik saldırılarına açık hale getirir:
- Bir kullanıcının belirli bir siteyi ziyaret edip etmediğini tespit etme: Kötü niyetli kişiler, önbellekte belirli bir siteye veya site grubuna özgü olabilecek bir kaynak olup olmadığını kontrol ederek söz konusu kullanıcının tarama geçmişini tespit edebilir.
- Siteler arası arama saldırısı: Zararlı bir kişi, belirli bir web sitesi tarafından kullanılan "arama sonucu yok" resminin tarayıcının önbelleğinde olup olmadığını kontrol ederek kullanıcının arama sonuçlarında rastgele bir dizenin olup olmadığını tespit edebilir.
- Siteler arası izleme: Önbellek, çerez benzeri tanımlayıcıları siteler arası izleme mekanizması olarak depolamak için kullanılabilir.
Chrome, bu riskleri azaltmak için Chrome 86'dan itibaren HTTP önbelleğini bölümlendirecektir.
Önbellek bölümlendirme, Chrome'un HTTP Önbelleğini nasıl etkiler?
Önbellek bölümlendirme ile, önbelleğe alınan kaynaklar, kaynak URL'sine ek olarak yeni bir "Ağ Yalıtım Anahtarı" kullanılarak anahtarlanır. Ağ Yalıtımı Anahtarı, üst düzey site ve geçerli çerçeve sitesinden oluşur.
Önbellek bölümlendirmenin farklı bağlamlarda nasıl çalıştığını görmek için bir önceki örneğe tekrar bakın:
![Önbellek Anahtarı { https://a.example, https://a.example, https://x.example/doge.png}](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsexam-97fe4405170ee.png?authuser=5&hl=tr)
https://a.example
, https://a.example
, https://x.example/doge.png
}
Kullanıcı, resim (https://x.example/doge.png
) isteyen bir sayfayı (https://a.example
) ziyaret eder. Bu durumda, resim ağdan istenir ve anahtar olarak https://a.example
(üst düzey site), https://a.example
(mevcut çerçeve sitesi) ve https://x.example/doge.png
(kaynak URL'si) öğelerinden oluşan bir unsur kullanılarak önbelleğe alınır. (Kaynak isteği üst düzey çerçeveden geldiğinde, Ağ Yalıtım Anahtarı'ndaki üst düzey site ve geçerli çerçeve sitesi aynı olur.)
![Önbellek Anahtarı { https://a.example, https://a.example, https://x.example/doge.png}](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsexam-d34238052404.png?authuser=5&hl=tr)
https://b.example
, https://b.example
, https://x.example/doge.png
}
Aynı kullanıcı, aynı resmin (https://x.example/doge.png
) aynısını isteyen farklı bir sayfayı (https://b.example
) ziyaret eder. Önceki örnekte aynı resim yüklenmiş olsa da, anahtar eşleşmediği için önbellek isabeti olmaz.
Görüntü ağdan istenir ve anahtar olarak https://b.example
, https://b.example
ve https://x.example/doge.png
öğelerinden oluşan bir unsur kullanılarak önbelleğe alınır.
![Önbellek Anahtarı { https://a.example, https://a.example, https://x.example/doge.png}](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsexam-b2b072114f1fc.png?authuser=5&hl=tr)
https://a.example
, https://a.example
, https://x.example/doge.png
}
Şimdi kullanıcı https://a.example
öğesine geri dönüyor, ancak bu kez resim
(https://x.example/doge.png
) bir iframe'e yerleştirilmiş. Bu durumda, anahtar https://a.example
, https://a.example
ve https://x.example/doge.png
içeren bir unsurdur ve bir önbellek isabeti gerçekleşir. (Üst düzey site ve iframe aynı site olduğunda, üst düzey çerçeveyle önbelleğe alınan kaynağın kullanılabileceğini unutmayın.
![Önbellek Anahtarı { https://a.example, https://a.example, https://x.example/doge.png}](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsexam-7f72d1a4803af.png?authuser=5&hl=tr)
https://a.example
, https://c.example
, https://x.example/doge.png
}
Kullanıcı https://a.example
konumunda geri döndü, ancak bu kez resim https://c.example
adresindeki bir iframe'de barındırılıyor.
Bu durumda görüntü, önbellekte https://a.example
, https://c.example
ve https://x.example/doge.png
anahtarlarından oluşan anahtarla eşleşen bir kaynak olmadığından ağdan indirilir.
![Önbellek Anahtarı { https://a.example, https://a.example, https://x.example/doge.png}](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsexam-bfba3d8b780d.png?authuser=5&hl=tr)
https://a.example
, https://c.example
, https://x.example/doge.png
}
Alan bir alt alan adı veya bağlantı noktası numarası içeriyorsa ne olur? Kullanıcı, resmi isteyen bir iFrame (https://c.example:8080
) yerleştiren https://subdomain.a.example
öğesini ziyaret eder.
Anahtar "şema://eTLD+1" temel alınarak oluşturulduğundan alt alan adları ve bağlantı noktası numaraları yoksayılır. Dolayısıyla bir önbellek isabeti oluşur.
![Önbellek Anahtarı { https://a.example, https://a.example, https://x.example/doge.png}](https://developer.chrome.com/static/blog/http-cache-partitioning/image/cache-key-httpsexam-752e8576ec61f.png?authuser=5&hl=tr)
https://a.example
, https://c.example
, https://x.example/doge.png
}
iframe birden fazla kez iç içe yerleştirilmişse ne olur? Kullanıcı, https://a.example
sayfasını ziyaret eder. iFrame (https://b.example
) yerleşik olarak başka bir iFrame (https://c.example
) yerleştirir ve son olarak resim isteğinde bulunur.
Anahtar, üst çerçeveden (https://a.example
) ve kaynağı (https://c.example
) yükleyen hemen kareden alındığından bir önbellek isabeti gerçekleşir.
SSS
Chrome'umda zaten etkin mi? Nasıl kontrol edebilirim?
Bu özellik, 2020'nin sonlarına doğru kullanıma sunulacaktır. Chrome örneğinizin bunu destekleyip desteklemediğini kontrol etmek için:
chrome://net-export/
menüsünü açın ve Diske Günlük Kaydını Başlat'a basın.- Günlük dosyasının bilgisayarınızda nereye kaydedileceğini belirtin.
- Web'e Chrome'la bir dakika göz atın.
chrome://net-export/
uygulamasına geri dönün ve Günlüğe Kaydetmeyi Durdur'a basın.https://netlog-viewer.appspot.com/#import
konumuna gidin.- Choose File'a (Dosya Seç) basın ve kaydettiğiniz günlük dosyasını iletin.
Günlük dosyasının çıkışını görürsünüz.
Aynı sayfada SplitCacheByNetworkIsolationKey
öğesini bulun. Ardından Experiment_[****]
gelirse Chrome'unuzda HTTP önbellek bölümlendirmesi etkinleştirilir. Ardından Control_[****]
veya Default_[****]
geliyorsa bu etkin değildir.
Chrome'umda HTTP önbellek bölümlendirmesini nasıl test edebilirim?
Chrome'unuzda HTTP önbellek bölümlendirmesini test etmek için Chrome'u bir komut satırı işaretiyle başlatmanız gerekir: --enable-features=SplitCacheByNetworkIsolationKey
. Chrome'u platformunuzda bir komut satırı işaretiyle nasıl başlatacağınızı öğrenmek için Chromium'u işaretlerle çalıştırma bölümündeki talimatları uygulayın.
Web geliştiricisi olarak, bu değişiklikle ilgili olarak yapmam gereken bir işlem var mı?
Bu, zarar veren bir değişiklik değildir, ancak bazı web hizmetleri için performans değerlendirmesi gerektirebilir.
Örneğin, birçok sitede (yazı tipleri ve popüler komut dosyaları gibi) yüksek miktarda önbelleğe alınabilir çok sayıda kaynak sunan web sitelerinin trafiğinde artış olabilir. Ayrıca, bu tür hizmetleri kullananlar bu hizmetlere daha fazla güvenebilir.
(Paylaşılan kitaplıkların Web Paylaşılan Kitaplıklar (sunum videosu) adı verilen ve gizliliği korumaya yönelik bir yöntemle etkinleştirilmesi için bir teklif vardır, ancak bu öneri hâlâ değerlendirme aşamasındadır.)
Bu davranış değişikliğinin etkisi nedir?
Genel önbellekte olmama oranı yaklaşık %3,6 artar, FCP'deki (First Contentful Paint) değişiklikler düşük düzeyde (yaklaşık %0,3) ve ağdan yüklenen toplam bayt oranı yaklaşık %4 oranında artar. Performans üzerindeki etkisi hakkında daha fazla bilgiyi HTTP önbellek bölümlendirme açıklayıcısı bölümünde bulabilirsiniz.
Bu standart bir uygulama mı? Diğer tarayıcılar farklı mı davranıyor?
Tarayıcılar farklı davransa da "HTTP önbellek bölümleri" getirme spesifikasyonunda standartlaştırılır:
- Chrome: Üst düzey şema://eTLD+1 ve çerçeve şeması://eTLD+1 kullanır.
- Safari: Üst düzey eTLD+1 kullanır
- Firefox: Üst düzey şema://eTLD+1 ile uygulamayı planlama ve Chrome gibi ikinci bir anahtar eklemeyi değerlendirme
Çalışanlardan getirme işlemi nasıl ele alınır?
Özel çalışanlar, geçerli çerçeveyle aynı anahtarı kullanır. Service Worker'lar ve paylaşılan çalışanlar, birden fazla üst düzey site arasında paylaşılabileceği için daha karmaşıktır. Bu çözümün çözümü şu anda tartışılıyor.