Service Worker'ların özelliklerinden biri de, hizmet çalışanının yüklemesi gerekir. Bu işlem, "önbelleğe alma" olarak adlandırılır. Önbelleğe alma, önbelleğe alınan dosyaların başka bir web sayfasına gitmeden tarayıcıya sunulmasını mümkün kılar ağa bağlayın. Sitenizin ihtiyaç duyduğu önemli öğeler için önbelleği kullanma Çevrimdışıyken: ana sayfa, stiller, yedek resim ve gerekli komut dosyaları.
Neden Workbox'ı kullanmalısınız?
Workbox'ı önceden önbelleğe alma için kullanmak isteğe bağlıdır. Web sitemiz g.co/newsinitiative/labs üzerinden hizmet çalışanı yüklenirken önemli öğeleri önbelleğe alma. Workbox'ı kullanmanın en önemli avantajı kullanıma hazır sürüm denetimidir. Önceden önbelleğe alınmış öğeleri güncellemek için Workbox'a göre çok daha az sorun bu dosyaların sürümünü ve güncellenmesini kendiniz yönetmeniz gerekti.
Önbellek manifestleri
Önbelleğe alma, bir URL listesi ve ekleyin. Birlikte düşünüldüğünde, bu bilgiler önbellek manifestini inceleyin. Manifest, "bilgi kaynağıdır" olması gereken her şeyin bir web uygulamasının belirli bir sürümünün önbelleğine alma yapar. Şuradaki önbellek manifesti: Workbox tarafından kullanılan biçim aşağıdaki gibi görünür:
[{
url: 'app.abcd1234.js'
}, {
url: 'offline.svg',
revision: '7836745f'
}, {
url: 'index.html',
revision: '518747aa'
}]
Hizmet çalışanı yüklendiğinde, komut dosyasında üç önbellek girişi oluşturulur.
Listelenen üç URL'nin her biri için Önbellek Depolama Alanı. İlk öğede sürüm oluşturma
URL'sinde zaten bulunan bilgiler (app gerçek dosya adıdır ve
.abcd1234, dosya uzantısından hemen önce sürüm oluşturma bilgilerini içerir
.js). Çalışma kutusunun derleme araçları bunu algılayıp bir düzeltme alanını hariç tutabilir. İlgili içeriği oluşturmak için kullanılan
diğer iki öğenin URL'lerinde sürüm oluşturma bilgisi bulunmaz; bu nedenle
derleme araçları alanında yerel değerlerinin bir karmasını içeren ayrı bir revision alanı oluşturur
dosyanın içeriği hakkında daha fazla bilgi edinin.
Ön belleğe alınmış kaynakları sunma
Önbelleğe öğe eklemek, önbellekteki hikayenin yalnızca bir parçasıdır;
önbellekteki öğelerin giden isteklere yanıt vermesi gerekir. Bu işlem için
Hizmet çalışanınızda hangi URL'lerin mevcut olduğunu kontrol edebilen fetch etkinlik işleyicisi
önbelleğe alınmış olmalıdır ve önbelleğe alınan bu yanıtları güvenilir bir şekilde döndürerek,
ağa bağlı olmanız gerekir. Service Worker, yanıt almak için önbelleği kontrol ettiğinden
(ve ağdan öncekileri kullanıyorsa) buna
önbelleğe öncelik verme stratejisi hakkında daha fazla bilgi edinin.
Etkili güncellemeler
Önbellek manifesti, beklenen önbelleğin tam temsilini sağlar state; manifestteki bir URL/düzeltme kombinasyonu değişirse hizmet çalışanı önceki önbelleğe alınmış girişin artık geçerli olmadığını ve güncellendi. Yalnızca ağ tarafından otomatik olarak gönderilen tek bir ağ isteği alır. hizmet çalışanının bir parçası olarak tarayıcı güncelleme kontrolü yaptıktan sonra, yenilenmesi gereken önceden önbelleğe alınmış URL'leri belirleyin.
Önbelleğe alınmış kaynaklarda yapılan güncellemeler
Zaman içinde web uygulamanızın yeni sürümlerini yayınladıkça, önceden önbelleğe alınmış URL'lerin güncel olup olmadığını kontrol edebilir, yeni öğeleri önbelleğe alabilir ve güncel olmayanları silebilirsiniz emin olun. Her seferinde tam önbellek manifesti oluşturmaya devam ettiğiniz sürece sitenizi yeniden oluşturursanız bu manifest, "veri kaynağı" işlevi görür. CANNOT TRANSLATE durumundaki önbellek durumunu kontrol edebilirsiniz.
Yeni bir düzeltme alanına sahip mevcut bir URL varsa veya
veya manuel olarak eklenmeyi gerektiriyorsa, hizmet çalışanınıza
bir güncelleme ya da güncellemenin
install
ve
activate
etkinlik işleyiciler gibi bazı etkinliklere erişebilirsiniz. Örneğin, sitenizde bazı değişiklikler yaptıysanız ve
en son önbellek manifestinizde aşağıdaki işlemlerden geçmiş olabilir:
değişiklikler:
[{
url: 'app.ffaa4455.js'
}, {
url: 'offline.svg',
revision: '7836745f'
}, {
url: 'index.html',
revision: '518747aa'
}]
Bu değişikliklerden her biri, hizmet çalışanınıza yeni isteklerin
önceden önbelleğe alınan girişleri güncellemek için yapıldı ('offline.svg' ve 'index.html')
ve yeni URL'leri önbelleğe alma ('app.ffaa4455.js'), ayrıca URL'leri temizlemek için silme işlemleri
artık kullanılmayan ('app.abcd1234.js').
Doğru "app store" yükleme deneyimi
Önbelleğe almanın bir başka faydası da, kullanıcılarınıza gerçek zamanlı olarak Aksi takdirde, "uygulama mağazası" dışında bunu gerçekleştirmek zor olurdu. teşekkür ederiz. Bir kullanıcı web uygulamanızdaki herhangi bir sayfayı ilk kez ziyaret ettiğinde potansiyel olarak herhangi bir görüntülemek için gereken URL'lerin tüm görüntüleme sayısını önceden görüntülemesi sayesinde, kullanıcıların her birini ziyaret edene kadar görünüm.
Kullanıcı bir uygulamayı yüklediğinde her bölümün hızlı bir şekilde görüntülenmesini bekler geri bildirimleri dikkate almalarıdır. Önbelleğe alma da aynı şeyi web uygulamalarına dönüştürebilirsiniz.
Öğelerinizden hangileri önceden önbelleğe alınmalıdır?
Sorunun ne olduğunu belirleme yardımcı olacak en iyi uygulamalardan biri. hangi URL'lerin önbelleğe alınmasının en mantıklı olduğunu gösteren bir resim sunar. Genel kural olarak Erken yüklenen ve işletmeniz için kritik öneme sahip olan tüm HTML, JavaScript veya CSS'leri gösteren bir şablondur.
Daha sonra yüklenen medya öğelerini veya diğer öğeleri önceden önbelleğe almaktan kaçınmak tercih edilir (web uygulamanızın işlevselliği açısından önemli olmadığı sürece). Bunun yerine, çalışma zamanı emin olmak için öğeler kullandıkça önbelleğe alınır.
Önbelleğe alma işlemi için ağ bant genişliği ve depolama alanının kullanılmasını gerektirdiğini (uygulama mağazasından uygulama yükleme işlemi gibi). Geliştirici olarak akıllı bir şekilde önbelleke almak ve aşırı yüksek önbellek manifestidir.
Workbox'ın derleme araçları, önbellekteki öğelerin sayısını söyleyerek size yardımcı olur manifest dosyasını ve önbellek yükünün toplam boyutunu belirtir.
Web uygulamanızı tekrar ziyaret eden kullanıcılar, uzun vadede ağdan kaçınma olanağı sayesinde, önbelleklerden zamanla tasarruf edeceği anlamına gelir.