Chrome 71'de, cache.addAll() ve importScripts() işlevlerinde yapılan değişiklikler

Service Works ve Cache Storage API kullanan geliştiriciler, küçük değişikliklerle Chrome 71'de kullanıma sunulacak. Her iki değişiklik de Chrome'un uygulamasını Google ile spesifikasyonlar ve diğer tarayıcılar.

Eşzamansız importScripts() işlemine izin verme

importScripts() ana hizmet çalışanı komut dosyanıza mevcut yürütmesini duraklatmasını, şuradan ek kod indirmesini söyler: ve geçerli genel kapsamda tamamlanana kadar çalıştırın. Bu işlem tamamlandığında, ana hizmet çalışanı komut dosyası yürütülmeye devam eder. importScripts(), şu durumlarda kullanışlı olur: ana Service Worker komut dosyanızı kurumsal nedenlerle daha küçük parçalara ayırmak istiyorsanız veya hizmet çalışanınıza işlev eklemek için üçüncü taraf kodu çekme.

Tarayıcılar, "tarayıcılar gibi eşzamanlı indirme ve çalıştırma işlemleri"nin olası performans kod" importScripts() aracılığıyla alınan her şeyi otomatik olarak önbelleğe alır (yani içe aktarılan kodun yürütülmesi sırasında çok az ek yük oluşturur.

Fakat bunun işe yaraması için, tarayıcının herhangi bir "sürpriz" olmayacağını bilmesi gerekir. kod içe aktarıldı ilk hatadan sonra hizmet çalışanına kurulum. Service Worker spesifikasyonuna göre, importScripts() çağrısının yalnızca üst düzey hizmet çalışanı komut dosyasını veya gerekirse install işleyicisinin içinde eşzamansız olarak kullanabilirsiniz.

Chrome 71'den önce, importScripts() aracının install işleyicisinin dışında eşzamansız olarak çağrılması iş yeri. Chrome 71'den itibaren, çalışma zamanı istisnası bildirir (aynı URL daha önce bir install işleyiciye içe aktarılmamışsa), eşleşen çalışma biçimini kullanabilirsiniz.

Bunun 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));
});

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 desteği sonlandırılıyor

Cache Storage API'sini bir hizmet çalışanıyla birlikte kullanıyorsanız İlgili spesifikasyona uygun Chrome 71 sürümü. Aynı URL bir çağrıya birden çok kez aktarılır ve cache.addAll(), spesifikasyonunda, çağrının verdiği sözün reddedilmesi gerektiği belirtiliyor.

Chrome 71'den önce bu algılanmıyordu ve yinelenen URL'ler etkili bir şekilde yoksayılıyordu.

Chrome konsolundaki uyarı mesajının ekran görüntüsü
Chrome 71'den itibaren konsola kaydedilen bir uyarı mesajı görürsünüz.

Bu günlük kaydı, Chrome 72'nin başlangıcıdır; burada yalnızca günlüğe kaydedilmiş bir uyarı yerine yinelenen URL'ler cache.addAll() reddetmesine yol açar. cache.addAll() adlı işletmeyi taahhüt zinciri kapsamında arıyorsanız şuraya geçirildi: InstallEvent.waitUntil(), Aksi takdirde, hizmet çalışanınızın yüklemesi başarısız olabilir.

Sorunla nasıl karşılaşabileceğiniz aşağıda açıklanmıştır:

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() ürününe iletilen gerçek URL'ler ve nelerin önbelleğe alındığına sonuçta '/' ve '/index.html' gibi farklı URL'lere sahip iki eşdeğer yanıt elde edilir bir reddetmeyi tetiklemez.

Service Worker uygulamanızı geniş ölçekte test etme

Service Worker'lar kapsamlı bir şekilde uygulanır tüm önemli "popüler" içeriklerinde daha fazla bilgi edinin. bu noktada. Progresif web uygulamanızı düzenli olarak birkaç tarayıcıyla test ediyorsanız veya Chrome kullanmayan önemli sayıda kullanıcı varsa tutarsızlığı düzeltti ve kodunuzu güncelleyin. Ancak büyük olasılıkla bunu fark etmemiş olsanız da bir davranışa sahip değillerse, Chrome'un davranışını değiştirmeden önce bu değişikliği belirtmek istedik.