Skrypty service worker są niezwykle przydatne, ale na początku mogą sprawiać trudności. Workbox ułatwia korzystanie z mechanizmów Service Worker. Ponieważ jednak pracownicy usług rozwiązują trudne problemy, abstrakcja tej technologii również może być trudne, jeśli jej nie zrozumieją. Zanim przejdziemy do szczegółowych informacji o Workbox, przeczytaj te pierwsze informacje.
Aby wyświetlić bieżącą listę mechanizmów Service Worker, wpisz chrome://serviceworker-internals/ na pasku adresu.
Co oferują mechanizmy Service Worker?
Skrypty service worker to wyspecjalizowane zasoby JavaScript, które działają jako serwery proxy między przeglądarkami a serwerami WWW. Ich celem jest zwiększenie niezawodności poprzez zapewnienie dostępu offline i zwiększenie wydajności stron.
Stopniowo wydłużający się cykl życia przypominający aplikacje
Skrypty service worker to ulepszenia istniejących witryn. Oznacza to, że jeśli użytkownicy korzystający z przeglądarek, które nie obsługują mechanizmów Service Worker, odwiedzają witryny, które z nich korzystają, nie działają żadne podstawowe funkcje. Na tym właśnie opiera się internet.
Skrypty service worker stopniowo ulepszają witryny w cyklu życia podobnym do aplikacji działających na poszczególnych platformach. Zastanów się, co się stanie, gdy aplikacja natywna zostanie zainstalowana ze sklepu z aplikacjami:
- Wysyłane żądanie pobrania aplikacji.
- Aplikacja zostanie pobrana i zainstalowana.
- Aplikacja jest gotowa do użycia i można ją uruchomić.
- Aplikacja jest aktualizowana o nowe wersje.
Cykl życia mechanizmów Service Worker jest podobny, ale cechuje się stopniowym ulepszeniem. Podczas pierwszej wizyty na stronie internetowej, która instaluje nowy skrypt service worker, podczas pierwszych wizyt na stronie jej podstawowe funkcje są dostępne, podczas gdy skrypt service worker pobiera. Po zainstalowaniu i aktywowaniu skryptu service worker steruje stroną, aby zapewnić większą niezawodność i szybkość.
Dostęp do interfejsu JavaScript API buforowania
Niezbędnym aspektem technologii mechanizmów Service Worker jest interfejs Cache, który jest mechanizmem buforowania całkowicie niezależnym od pamięci podręcznej HTTP.
Dostęp do interfejsu Cache jest możliwy z poziomu skryptu service worker i wątku głównego.
Otwiera to wiele możliwości w zakresie interakcji użytkowników z instancją Cache.
Wpływ na pamięć podręczną HTTP mają dyrektywy dotyczące buforowania określone w nagłówkach HTTP, a interfejs Cache można programować w języku JavaScript.
Oznacza to, że buforowanie odpowiedzi na żądania sieciowe może działać na podstawie logiki najlepszej dla danej witryny.
Na przykład:
- Przy pierwszym żądaniu zasoby statyczne należy przechowywać w pamięci podręcznej i przy każdym kolejnym żądaniu wyświetlać tylko z pamięci podręcznej.
- Przechowuj znaczniki stron w pamięci podręcznej, a w przypadku offline wyświetlaj tylko znaczniki z pamięci podręcznej.
- W przypadku niektórych zasobów możesz wyświetlać nieaktualne odpowiedzi z pamięci podręcznej, ale aktualizować je z sieci w tle.
- Przesyłaj strumieniowo częściową treść z sieci i łącz ją z powłoką aplikacji z pamięci podręcznej, aby poprawić jakość percepcyjną.
Każda z nich jest przykładem strategii buforowania. Strategie buforowania umożliwiają pracę offline i mogą zapewnić większą wydajność dzięki unikaniu ponownego sprawdzania walidacji pamięci podręcznej HTTP z dużym opóźnieniem. Zanim przejdziemy do Workbox, przeanalizujemy kilka strategii buforowania i kod, który umożliwi ich działanie.
Asynchroniczny i oparty na zdarzeniach interfejs API
Przenoszenie danych przez sieć jest z założenia asynchroniczne. Czasem żądanie zasobu, odpowiedź serwera na żądanie i pobranie odpowiedzi są potrzebne. Czas jest zróżnicowany i nieokreślony. Skrypty service worker obsługują tę asynchronizację za pomocą interfejsu API opartego na zdarzeniach, wykorzystując wywołania zwrotne dla takich zdarzeń:
- Gdy skrypt service worker instaluje usługę.
- Gdy skrypt service worker się aktywuje.
- Gdy skrypt service worker wykryje żądanie sieciowe.
Zdarzenia można rejestrować za pomocą dobrze znanego interfejsu API addEventListener.
Wszystkie te zdarzenia mogą potencjalnie wchodzić w interakcje z interfejsem Cache.
Szczególnie kluczowa dla zapewnienia niezawodności i szybkości jest możliwość uruchamiania wywołań zwrotnych po rozesłaniu żądań sieciowych.
Wykonywanie zadań asynchronicznych w języku JavaScript wiąże się z używaniem obietnic.
Te funkcje JavaScript mogą również zostać wykorzystane do uproszczenia kodu service worker (i Workbox!) dla programistów, ponieważ obiecują również podstawy async i await.
Wstępne buforowanie i buforowanie czasu działania
Interakcja między skryptem service worker a instancją Cache wiąże się z 2 różnymi pojęciami dotyczącymi buforowania: wstępne buforowanie i buforowanie czasu działania.
Każdy z tych elementów ma kluczowe znaczenie dla korzyści, jakie może zapewnić mechanizm Service Worker.
Wstępne buforowanie to proces buforowania zasobów z wyprzedzeniem, zwykle podczas instalacji skryptu service worker.
Dzięki wstępnemu zapisywaniu w pamięci podręcznej kluczowe zasoby statyczne i materiały potrzebne do dostępu offline można pobierać i przechowywać w instancji Cache.
Ten rodzaj buforowania przyspiesza też wyświetlanie kolejnych stron, które wymagają zasobów ze wstępnie zapisanych pamięci.
Buforowanie środowiska wykonawczego ma miejsce, gdy strategia buforowania jest stosowana do zasobów, które są wysyłane z sieci w czasie działania. Ten rodzaj buforowania jest przydatny, ponieważ gwarantuje dostęp offline do stron i zasobów, które użytkownik już odwiedził.
Te sposoby wykorzystania interfejsu Cache w skrypcie service worker zapewniają ogromne korzyści użytkownikom i zapewniają działanie podobne do aplikacji w przypadku zwykłych stron internetowych.
Izolacja od wątku głównego
Wydajność JavaScriptu to nieustanne wyzwanie dla internetu, które z perspektywy użytkownika zależy od możliwości urządzenia i dostępu do szybkiego internetu. Im więcej języka JavaScript, tym trudniejsze staje się tworzenie szybkich stron, które są atrakcyjne dla użytkowników.
Skrypty service worker są podobne do instancji roboczych, ponieważ cała praca wykonywana przez nich jest wykonywana we własnych wątkach. Oznacza to, że zadania service worker nie będą konkurować o uwagę z innymi zadaniami w wątku głównym. Mechanizmy Service Worker zaprojektowano z myślą o użytkowniku.
Droga w przyszłość
Ta dokumentacja jest tylko ogólnym omówieniem. Przed opracowaniem odpowiedniego narzędzia Workbox trzeba poruszyć jeszcze kilka kwestii związanych z mechanizmami Servicebox. Jednak zapewniamy, że jeśli dobrze je zrozumiesz, korzystanie z Workbox będzie łatwiejsze i wydajniejsze.