Tüm tarayıcılar, web uygulamanızın kökeninin kullanmasına izin verilen depolama alanı miktarı için bir üst sınır uygular. Web sitenizin önbelleğe alma verimliliğini ve güvenilirliğini etkileyebilecek depolama alanı kotası sınırlamalarına takılmamak için Workbox'u, çalışma zamanında önbelleğe aldığı verileri otomatik olarak temizleyecek şekilde yapılandırabilirsiniz.
Hangi yapılandırma seçenekleri desteklenir?
Bir rota ve çalışma zamanında önbelleğe alma stratejisi oluştururken, önbelleğe aldığınız öğe türü için en uygun ayarlarla yapılandırılmış workbox-expiration öğesinden bir ExpirationPlugin örneği ekleyebilirsiniz.
Örneğin, aşağıdaki yapılandırma, hem açık sınırlar hem de kota aşılırsa otomatik temizleme ile resimleri çalışma zamanında önbelleğe almak için kullanılabilir:
import {registerRoute} from 'workbox-routing';
import {CacheFirst} from 'workbox-strategies';
import {ExpirationPlugin} from 'workbox-expiration';
registerRoute(
({request}) => request.destination === 'image',
// Use a cache-first strategy with the following config:
new CacheFirst({
// You need to provide a cache name when using expiration.
cacheName: 'images',
plugins: [
new ExpirationPlugin({
// Keep at most 50 entries.
maxEntries: 50,
// Don't keep any entries for more than 30 days.
maxAgeSeconds: 30 * 24 * 60 * 60,
// Automatically cleanup if quota is exceeded.
purgeOnQuotaError: true
})
]
})
);
ExpirationPlugin kullanırken maxEntries, maxAgeSeconds veya her ikisini de ayarlamanız gerekir. purgeOnQuotaError isteğe bağlıdır.
maxEntries
Bu, belirli bir önbellek için giriş sayısına (yani benzersiz URL'lere) bir üst sınır getirir.
Belirli bir strateji tarafından işlenebilecek az sayıda olası URL olduğunu bilmiyorsanız bunu ayarlamak normalde iyi bir fikirdir.
maxAgeSeconds
Bu saniye sayısından daha uzun süre önce önbelleğe eklenen girişler güncelliğini yitirmiş olarak kabul edilir ve önbelleğe bir sonraki erişimde otomatik olarak temizlenir.
Girişlerin tümü kısa bir süre içinde eklendiği sürece önbelleğiniz keyfi olarak büyük bir boyuta ulaşabileceğinden, bu yöntem depolama alanı kotasını yönetmede maxEntries kadar etkili değildir. Bu yöntem, geçerlilik süresi için belirlemek istediğiniz bir üst sınır olduğunu ve eski girişlerin web uygulamanız için çok az değeri olduğunu bildiğiniz durumlarda en yararlı olur.
purgeOnQuotaError
Bu seçenek, web uygulamanızın mevcut depolama alanını aşması durumunda belirli bir önbelleği otomatik olarak silinebilecek şekilde güvenli olarak işaretlemenize olanak tanır.
Bu seçenek şu anda varsayılan olarak false olarak ayarlanmıştır. Çalışma zamanı önbellekleri genel olarak silinmeye karşı dayanıklı olmalıdır. Bu nedenle, bu seçeneğin true olarak ayarlanması iyi bir uygulamadır ve web uygulamanızın depolama alanı kısıtlamaları karşısında otomatik olarak kurtarılabilmesini sağlar.
Ne kadar veri depolamanıza izin verilir?
Her tarayıcının depolama alanı konusunda kendi üst sınırları vardır, bu nedenle tek bir yanıt yoktur. Ayrıca bazı tarayıcılarda, belirli bir cihazda boş depolama alanı miktarına göre değişen dinamik bir sınır vardır. Bu nedenle, geçerli üst sınır haber verilmeden değişebilir.
Bazı tarayıcılar, navigator.storage.estimate() aracılığıyla üst sınırla birlikte kaynağınızın kullandığı yaklaşık depolama alanı miktarını sorgulamak için bir arayüz sunar. Bu işlevi kendi web uygulamalarınızda nasıl kullanabileceğiniz hakkında daha fazla bilgiyi "Kullanılabilir Depolama Alanını Tahmin Etme" makalesinde bulabilirsiniz.
Chrome'da Gizli Mod ile ilgili dikkat edilmesi gereken noktalar
Bir web uygulamasını Chrome'un Gizli modunda açmak, depolama alanıyla ilgili normal göz atma bağlamları için geçerli olmayan özel bir kısıtlamaya neden olur: Cihazınızda boş alan ne olursa olsun yaklaşık 100 megabaytlık bir kota sınırı vardır.
Belirsiz yanıtlara karşı dikkatli olun.
Beklenmedik şekilde yüksek kota kullanımının yaygın bir nedeni, saydam olmayan yanıtların (yani CORS etkinleştirilmeden yapılan isteklerin merkezler arası yanıtları) çalışma zamanında önbelleğe alınmasıdır.
Tarayıcılar, güvenlik önlemi olarak bu opak yanıtların kota etkisini otomatik olarak artırır. Örneğin, Chrome'da birkaç kilobaytlık opak bir yanıt bile kota kullanımınıza yaklaşık 7 megabayt katkıda bulunur.
Opak yanıtları önbelleğe almaya başladığınızda beklediğinizden çok daha fazla kotayı hızla kullanabilirsiniz. Bu nedenle, en iyi uygulama ExpirationPlugin öğesini maxEntries ve potansiyel olarak purgeOnQuotaError ile uygun şekilde yapılandırılmış şekilde kullanmaktır.