Co to są progresywne aplikacje internetowe i jak je zainstalować?

Co to są progresywne aplikacje internetowe i jak je zainstalować?

Aplikacje dominują w Twoim telefonie. Przez długi czas aplikacje nie wpływały w ten sam sposób na pulpit lub przeglądarkę. To się zmieniło w ostatnich latach. Progresywne aplikacje internetowe (PWA) zyskują na popularności i zmieniają nasze interakcje z wszelkiego rodzaju witrynami internetowymi.





Ale czym właściwie jest progresywna aplikacja internetowa? Co robi PWA, czego nie robi strona internetowa? Oto, co musisz wiedzieć o progresywnych aplikacjach internetowych.



Co to jest progresywna aplikacja internetowa?

Progresywne aplikacje internetowe to aplikacje internetowe, które oferują użytkownikom zwykłą witrynę, ale wyglądają jak natywna aplikacja mobilna. Programy PWA próbują przenieść użyteczność natywnej aplikacji mobilnej do zestawu funkcji nowoczesnych przeglądarek, w pełni wykorzystując postępy w obu obszarach rozwoju.





Co zatem definiuje PWA?

  • uniwersalny : PWA musi działać bezproblemowo (no, prawie) dla każdego użytkownika, niezależnie od przeglądarki.
  • Czuły : PWA powinny działać z dowolnym urządzeniem, takim jak laptop, tablet, smartfon itd.
  • Projekt : projekt powinien naśladować natywne aplikacje mobilne, co oznacza usprawnione, łatwe do znalezienia menu z prostą interaktywnością dla zaawansowanych funkcji.
  • Bezpieczna : PWA powinny używać protokołu HTTPS, aby zapewnić bezpieczeństwo danych użytkownika.
  • Wykrywalny: użytkownicy mogą znaleźć PWA i łatwo je zidentyfikować jako aplikację (a nie „witrynę”).
  • Zaręczyny: PWA musi mieć dostęp do natywnych funkcji angażujących, takich jak powiadomienia push.
  • Aktualizacje: Programy PWA pozostają aktualne, obsługując najnowsze wersje usługi lub witryny.
  • Instalacja: pozwalają użytkownikom łatwo „zainstalować” PWA na ekranie głównym bez konieczności korzystania ze sklepu z aplikacjami.
  • Dzielenie się: Programy PWA wymagają do udostępnienia tylko jednego adresu URL, bez żadnej instalacji.

Jak widać, PWA mają na celu zapewnienie użytkownikom pełnego doświadczenia z witryną dzięki usprawnionym funkcjom i projektowi interfejsu aplikacji natywnej.



Jak działa progresywna aplikacja internetowa?

Kluczem do progresywnych aplikacji internetowych są pracownicy usług przeglądarki.

Service worker to skrypt, który działa w tle przeglądarki, „oddziela się od strony internetowej, otwierając drzwi do funkcji, które nie wymagają strony internetowej ani interakcji użytkownika”. Możesz użyć pracowników usług, takich jak powiadomienia push i synchronizacja w tle w tej chwili, ale najbliższa przyszłość PWA daje tym skryptom większą moc.



Jako tacy pracownicy usług stanowią podstawę standardu PWA, wykorzystując pamięć podręczną sieci do niemal natychmiastowych wyników.

Przed Service Workerami skryptem do pamięci podręcznej przeglądarki był Application Cache (lub App Cache). Pamięć podręczna aplikacji jest dostępna w wielu usługach offline, ale była nieco podatna na błędy. Ponadto pamięć podręczna aplikacji ma kilka dobrze znanych ograniczeń, takich jak Lista obok wyjaśnia.



Ale głównym problemem dla programistów jest brak bezpośredniej interakcji z dokładnie tym, jak działa AppCache, co uniemożliwia programistom dokładne naprawianie problemów w miarę ich pojawiania się. Z kolei strony i usługi z pełną funkcjonalnością offline były ryzykownym wyborem.

Pracownicy usług wytrzymują jednak tylko tak długo, jak ich działanie jest wymagane. W PWA, gdy klikniesz coś lub użyjesz funkcji, pracownik serwisu uruchamia się. Service worker (pamiętaj, że to skrypt) przetwarza zdarzenie, decydując, czy pamięć podręczna offline może zrealizować żądanie. Pomysł polega na tym, że PWA ma do wyboru wiele pamięci podręcznych offline, co daje znacznie szerszy zakres funkcjonalności offline.

Ponadto pamięć podręczna służy nie tylko do zwiększania prędkości w trybie offline. Na przykład idziesz do PWA, ale twoje połączenie jest bardzo niejednolite. Pracownik serwisu obsługuje poprzednią pamięć podręczną, w pełni działającą, bez zakłócania Twojego doświadczenia.

Obsługa progresywnej przeglądarki internetowej

Istnieją dwa wymagania dotyczące korzystania z progresywnej aplikacji internetowej: zgodna przeglądarka i usługa obsługująca PWA.

Najpierw spójrzmy na przeglądarki. Masz dwie możliwości sprawdzenia obsługi przeglądarki PWA. Pierwszy to Jake Archibald Czy Service Worker jest gotowy? ? który z łatwością wyświetla stan gotowości PWA głównych przeglądarek oraz Internetu Samsung.

Aby uzyskać bardziej szczegółowy przegląd obsługi przeglądarki PWA, powinieneś sprawdzić Mogę uzyć , witryna specjalizująca się w wyświetlaniu informacji o implementacji różnych technologii internetowych i przeglądarek według wersji przeglądarki. Na przykład, jeśli wpiszesz „service workery” w pasku wyszukiwania, znajdziesz tabelę wyświetlającą numer wersji, z którą każda przeglądarka zaimplementowała serviceworki PWA.

Tabela Czy mogę używać Service Workers potwierdza, że ​​wszystkie główne przeglądarki obsługują PWA. Pokazuje również obsługę PWA dla kilku alternatywnych przeglądarek komputerowych i przeglądarek mobilnych.

Rozbijając to trochę bardziej:

  • Przeglądarka na komputer (Pełne wsparcie): Chrome, Firefox, Opera, Edge, Safari
  • Przeglądarka komputerowa (częściowa obsługa/nieaktualna wersja): Przeglądarka QQ, przeglądarka Baidu
  • Przeglądarka mobilna (Pełne wsparcie): Chrome, Firefox, Safari, UC Browser, Samsung internet, Mint Browser, Wechat
  • Przeglądarka mobilna (częściowa obsługa/nieaktualna wersja): Przeglądarka QQ, przeglądarka Android, Opera Mobile

Tak więc wszystkie główne przeglądarki obsługują PWA. Microsoft Edge i Safari to najnowsze dodatki do pełnej listy wsparcia. I odwrotnie, zarówno przeglądarka QQ, jak i przeglądarka Baidu używają teraz przestarzałych wersji i jako takie spadły na drugi poziom.

Jak znaleźć i zainstalować progresywną aplikację internetową?

Teraz, gdy już wiesz, jakiej przeglądarki użyć, możesz pomyśleć o wyszukaniu i zainstalowaniu PWA. W tym przykładzie użyję Samsunga Galaxy S8 z Google Chrome.

Progresywne aplikacje internetowe są wszędzie. Wiele firm dostosowało swoje witryny i usługi, aby oferować wersję Progressive Web App. W wielu przypadkach po raz pierwszy napotkasz PWA, gdy przejdziesz na stronę główną lub mobilną witrynę usługi, co powoduje Dodaj do ekranu głównego Okno dialogowe.

Obejrzyj poniższy film, aby zobaczyć, co się dzieje, gdy odwiedzasz Witryna mobilna na Twitterze .

Oczywiście odwiedzanie niezliczonych witryn i nadzieja na wyświetlenie wyzwalacza ekranu głównego nie jest przydatne. W rzeczywistości jest to wręcz czasochłonne. Na szczęście nie musisz tego robić, ponieważ istnieje kilka witryn poświęconych katalogowaniu PWA.

Pierwsza próba outweb . Zawiera całkiem przyzwoitą gamę PWA, z często pojawiającymi się nowymi opcjami. Następnie wypróbuj pwa.rocks. Ma mniejszy wybór, ale kilka przydatnych PWA, które będziesz chciał dodać do swojego urządzenia.

Ponadto w styczniu 2019 r. Chrome 72 na Androida został dostarczony z Trusted Web Activity (TWA). TWA umożliwia otwieranie kart Chrome w trybie autonomicznym. To z kolei pozwala PWA pojawiać się w sklepie z aplikacjami Google Play. Kilka pierwszych aplikacji PWA, które pojawiły się w Google Play, to Lite na Twitterze , Instagram Lite i Mapy Google , a z czasem pojawi się więcej.

Galeria obrazów (2 obrazy) Zwiększać Zwiększać Blisko

Czy progresywne aplikacje internetowe zastąpią aplikacje natywne?

Progresywne aplikacje internetowe to doskonały hybrydowy krok między przeglądarką a natywną aplikacją mobilną. Czy PWA całkowicie zastąpią aplikacje natywne? To twarde nie z mojej strony. Aplikacje PWA świetnie sprawdzają się jako lekka oferta, ale biorąc pod uwagę, że obecnie koncentrują się głównie na replikowaniu istniejących witryn i usług, nie zastąpią aplikacji natywnych.

Przynajmniej na razie nie.

jak przełączyć domyślne konto google

PWA jednak działają. Potwierdzają to również dane dostępne w PWA Stats. Oto kilka interesujących liczb, które ilustrują, w jaki sposób PWA zmieniają nasze interakcje z powszechnie używanymi witrynami:

  • Trivago odnotowało 150-procentowy wzrost zaangażowania użytkowników, którzy dodali swoje PWA do ekranu głównego.
  • Strona główna PWA Forbesa „ładuje się całkowicie w zaledwie 0,8 sekundy”, podczas gdy liczba wyświetleń na wizytę wzrosła o 10 procent. PWA Forbesa również podwoiło długość sesji użytkownika.
  • Twitter Lite odnotował 65-procentowy wzrost liczby stron na sesję, z ogromnym 75-procentowym wzrostem tweetów. Jest również interaktywny „w mniej niż 5 sekund w sieci 3G”.
  • Alibaba odnotowała 76-procentowy wzrost liczby konwersji mobilnych.

PWA nie są jeszcze popularne. Jednak dzięki ogromnej gamie korzyści, jakie zapewniają, takich jak oszczędność miejsca na urządzeniu , w przyszłości usłyszysz o nich więcej.

Udział Udział Ćwierkać E-mail Przewodnik dla początkujących dotyczący animacji mowy

Animowanie mowy może być wyzwaniem. Jeśli jesteś gotowy, aby rozpocząć dodawanie dialogu do swojego projektu, podzielimy ten proces za Ciebie.

Czytaj dalej Powiązane tematy O autorze Gavin Phillips(945 opublikowanych artykułów)

Gavin jest Junior Editor for Windows and Technology Explained, stałym współpracownikiem podcastu Really Useful i regularnym recenzentem produktów. Posiada tytuł licencjata (z wyróżnieniem) współczesnego pisania z praktykami sztuki cyfrowej splądrowanej ze wzgórz Devon, a także ponad dziesięcioletnie doświadczenie zawodowe w pisaniu. Lubi obfite ilości herbaty, gry planszowe i piłkę nożną.

Więcej od Gavina Phillipsa

Zapisz się do naszego newslettera

Dołącz do naszego newslettera, aby otrzymywać porady techniczne, recenzje, bezpłatne e-booki i ekskluzywne oferty!

Kliknij tutaj, aby zasubskrybować