Service Worker ve Cache Storage API'yi kullanan geliştiriciler, Chrome 71'de kullanıma sunulacak iki küçük değişiklik konusunda dikkatli olmalıdır. Her iki değişiklik de Chrome uygulamasını spesifikasyonlar ve diğer tarayıcılarla daha uyumlu hale getirmektedir.
Eşzamansız importScripts() işlevine izin vermeme
importScripts(), ana hizmet çalışanı komut dosyanıza mevcut yürütülmesini duraklatmasını, belirli bir URL'den ek kod indirmesini ve geçerli global kapsamda tamamlanmasını sağlar. Bu işlem tamamlandıktan sonra ana Service Worker komut dosyası, yürütmeye devam eder. importScripts(), organizasyonel nedenlerle ana Service Worker komut dosyanızı küçük parçalara bölmek veya üçüncü taraf kodları kullanarak Service Worker'ınıza işlev eklemek istediğinizde kullanışlıdır.
Tarayıcılar, importScripts() aracılığıyla çekilen her şeyi otomatik olarak önbelleğe alarak "bazı eşzamanlı kodlar indirip çalıştırmanın" olası performans sorunlarını azaltmaya çalışır. Böylece, ilk indirme işleminden sonra içe aktarılan kodun yürütülmesi çok az ek yüke neden olur.
Ancak bunun işe yaraması için tarayıcının, ilk yüklemeden sonra Service Worker'a "sürpriz" kodun aktarılmayacağını bilmesi gerekir.
Service Worker spesifikasyonuna göre, importScripts() çağrısının yalnızca üst düzey Service Worker komut dosyasının eşzamanlı yürütülmesi sırasında veya gerekirse install işleyicisi içinde eşzamansız olarak yürütülmesi gerekir.
Chrome 71'den önce importScripts() işlevi, install işleyicinin dışında eşzamansız olarak çağrılıyordu. Chrome 71'den itibaren bu çağrılar bir çalışma zamanı istisnası sağlar (aynı URL daha önce bir install işleyicisinde içe aktarılmadığı sürece) ve diğer tarayıcılardaki davranışla eşleşir.
Bunun yerine, aşağıdaki gibi bir kod kullanın:
// This only works in Chrome 70 and below.
self.addEventListener('fetch', event => {
importScripts('my-fetch-logic.js');
event.respondWith(self.customFetchLogic(event));
});
Service Worker kodunuz aşağıdaki gibi görünmelidir:
// Move the importScripts() to the top-level scope.
// (Alternatively, import the same URL in the install handler.)
importScripts('my-fetch-logic.js');
self.addEventListener('fetch', event => {
event.respondWith(self.customFetchLogic(event));
});
cache.addAll() işlevine iletilen tekrarlanan URL'lerin kullanımdan kaldırılması
Cache Storage API'yi bir hizmet çalışanıyla birlikte kullanıyorsanız Chrome 71'de ilgili spesifikasyona uygun başka bir küçük değişiklik yapılmıştır. Aynı URL, cache.addAll() için yapılan tek bir çağrıya birden çok kez iletildiğinde, spesifikasyonda çağrı tarafından döndürülen sözün reddedilmesi gerektiği belirtilir.
Chrome 71'den önce bu algılanmıyordu ve kopya URL'ler etkin bir şekilde yok sayılıyordu.
Bu günlük kaydı, Chrome 72'nin başlangıcı niteliğindedir. Burada, günlüğe kaydedilen bir uyarı yerine yinelenen URL'ler cache.addAll() ürününün reddetmesine neden olur. Genel uygulamada olduğu gibi, InstallEvent.waitUntil()'e iletilen söz zinciri kapsamında cache.addAll() çağırıyorsanız bu reddetme işlemi, Service Worker'ınızın yüklenmemesine neden olabilir.
Aşağıda, şu şekilde sorun yaşayabilirsiniz:
const urlsToCache = [
'/index.html',
'/main.css',
'/app.js',
'/index.html', // Oops! This is listed twice and should be removed.
];
self.addEventListener('install', event => {
event.waitUntil(
caches.open('my-cache').then(cache => cache.addAll(urlsToCache))
);
});
Bu kısıtlama yalnızca cache.addAll() öğesine iletilen gerçek URL'ler için geçerlidir. Bunun sonucunda, '/' ve '/index.html' gibi farklı URL'lere sahip iki eşdeğer yanıtın önbelleğe alınması, reddetmeyi tetiklemez.
Service Worker uygulamanızı geniş ölçekte test etme
Bu noktada Service Worker'lar, başlıca "her zaman etkin" olan tüm tarayıcılarda genel olarak uygulanmaktadır. Progresif web uygulamanızı çeşitli tarayıcılarla düzenli olarak test ediyorsanız veya Chrome kullanmayan çok sayıda kullanıcınız varsa bu tutarsızlığı zaten fark etmiş ve kodunuzu güncellemiş olabilirsiniz. Ancak bu davranışı diğer tarayıcılarda fark etmemiş olsanız olasılık olmasa da Chrome'un davranışını değiştirmeden önce bu değişikliği duyurmak istedik.