Servisní pracovníci jsou skvělí pro mnoho účelů: rychlost, offline, ovládání mezipaměti a další. Pokud vás to zajímá, můžete si prohlédnout mnoho ukázek použití kódu service worker v kuchařce Service Worker. Jeden z těchto receptů, Okamžitá reklamace, je stejně důležitý a užitečný, protože poskytuje způsob, jak získat svého servisního pracovníka rychleji, což znamená, že můžete rychleji přijímat události načtení.
Následující zrychlení kódu můžete přirovnat k DOMContentLoaded
(běžně známé jako domready
) vs. stará verze load
událost -- uvede zpracování do pohybu rychleji. Tento trik zahrnuje install
servisního pracovníka a activate
události:
// Install event - cache files (...or not) // Be sure to call skipWaiting()! self.addEventListener('install', function(event) { event.waitUntil( caches.open('my-cache').then(function(cache) { // Important to `return` the promise here to have `skipWaiting()` // fire after the cache has been updated. return cache.addAll([/* file1.jpg, file2.png, ... */]); }).then(function() { // `skipWaiting()` forces the waiting ServiceWorker to become the // active ServiceWorker, triggering the `onactivate` event. // Together with `Clients.claim()` this allows a worker to take effect // immediately in the client(s). return self.skipWaiting(); }) ); }); // Activate event // Be sure to call self.clients.claim() self.addEventListener('activate', function(event) { // `claim()` sets this worker as the active worker for all clients that // match the workers scope and triggers an `oncontrollerchange` event for // the clients. return self.clients.claim(); });
Nakonec vrací skipWaiting()
z install
událost spustí activate
událost, která okamžitě aktivuje servisního pracovníka a umožní vašemu servisnímu pracovníkovi pracovat s fetch
události a další možnosti servisních pracovníků. Servisní pracovníci vyžadují k aktivaci navigační událost (opětovné načtení stránky, přechod na novou stránku atd.), a proto je tento trik tak užitečný.
V nadcházejících měsících se můžete těšit na další tipy a příklady pro servisní pracovníky na blogu!