Hizmet çalışanlarını ve Cache Storage API'yi kullanan geliştiriciler, Chrome 71'de kullanıma sunulan iki küçük değişiklikten haberdar olmalıdır. Her iki değişiklik de Chrome'un uygulamasını özelliklere ve diğer tarayıcılara daha uygun hale getiriyor.
Asenkron importScripts() işlevine izin vermeme
importScripts(), ana hizmet çalışanı komut dosyanıza mevcut yürütme işlemini duraklatmasını, belirli bir URL'den ek kod indirmesini ve mevcut global kapsamda tamamlanana kadar çalıştırmasını söyler. Bu işlem tamamlandıktan sonra ana hizmet çalışanı komut dosyası yürütülmeye devam eder. importScripts(), ana hizmet çalışanı komut dosyanızı organizasyonel nedenlerle daha küçük parçalara ayırmak veya hizmet çalışanınıza işlev eklemek için üçüncü taraf kodunu dahil etmek istediğinizde kullanışlıdır.
Tarayıcılar, importScripts() aracılığıyla alınan her şeyi otomatik olarak önbelleğe alarak "bazı senkronize kodları indirip çalıştırma" işleminin olası performans sorunlarını azaltmaya çalışır. Bu sayede, ilk indirme işleminden sonra içe aktarılan kodun yürütülmesiyle ilgili çok az ek yük oluşur.
Bunun işe yaraması için tarayıcının, ilk yükleme işleminden sonra hizmet işleyiciye "sürpriz" kod aktarılmayacağını bilmesi gerekir.
Hizmet çalışanı spesifikasyonuna göre, importScripts() çağrısının yalnızca üst düzey hizmet çalışanı komut dosyasının eşzamanlı yürütülmesi sırasında veya gerekirse install işleyici içinde eşzamansız olarak çalışması gerekir.
Chrome 71'den önce importScripts() işlevinin install işleyicisinin dışında eşzamansız olarak çağrılması işe yarıyordu. Chrome 71'den itibaren bu çağrılar, diğer tarayıcılardaki davranışla eşleşecek şekilde (aynı URL daha önce bir install işleyiciye aktarılmadığı sürece) çalışma zamanında istisna oluşturur.
Aşağıdaki gibi bir kod yerine:
// This only works in Chrome 70 and below.
self.addEventListener('fetch', event => {
importScripts('my-fetch-logic.js');
event.respondWith(self.customFetchLogic(event));
});
Hizmet çalışanı 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'ler için desteğin sonlandırılması
Cache Storage API'yi bir hizmet çalışanıyla birlikte kullanıyorsanız Chrome 71'de ilgili spesifikasyona uygun olarak yapılan küçük bir değişiklik daha var. Aynı URL, cache.addAll() için tek bir çağrıya birden çok kez iletildiğinde, şartnamede çağrının döndürdüğü promise'in reddedilmesi gerektiği belirtilir.
Chrome 71'den önce bu durum algılanmaz ve yinelenen URL'ler etkili bir şekilde yok sayılırdı.
Bu günlük kaydı, Chrome 72'nin bir başlangıcıdır. Chrome 72'de, yinelenen URL'ler yalnızca günlük kaydına alınan bir uyarı yerine cache.addAll() reddedilmesine neden olur. cache.addAll()'yi, yaygın uygulama olduğu üzere InstallEvent.waitUntil()'ye iletilen bir promise zinciri kapsamında çağırıyorsanız bu ret, hizmet çalışanınızın yüklenememesi sorununa neden olabilir.
Aşağıdaki durumlarda sorunla karşılaşabilirsiniz:
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() adresine iletilen gerçek URL'ler için geçerlidir ve '/' ve '/index.html' gibi farklı URL'lere sahip iki eşdeğer yanıtın önbelleğe alınması reddi tetiklemez.
Hizmet çalışanı uygulamanızı geniş çapta test etme
Hizmet çalışanları şu anda tüm büyük "her zaman güncel" tarayıcılarda yaygın olarak uygulanmaktadır. Progressive web uygulamanızı düzenli olarak çeşitli tarayıcılarda test ediyorsanız veya Chrome kullanmayan önemli sayıda kullanıcınız varsa tutarsızlığı zaten tespit edip kodunuzu güncellemiş olabilirsiniz. Ancak diğer tarayıcılarda bu davranışı fark etmemiş olmanız ihtimaline karşı, Chrome'un davranışını değiştirmeden önce bu değişikliği belirtmek istedik.