Čo sú to progresívne webové aplikácie a ako si ich nainštalujem?

Čo sú to progresívne webové aplikácie a ako si ich nainštalujem?

Vášmu telefónu dominujú aplikácie. Aplikácie dlho neovplyvňovali váš počítač alebo prehliadač rovnakým spôsobom. To sa za posledné roky zmenilo. Progresívne webové aplikácie (PWA) rastú a menia naše interakcie so všetkými druhmi webových stránok.





Ale čo je to vlastne progresívna webová aplikácia? Čo robí PWA a ktorý web nie? Tu je to, čo potrebujete vedieť o progresívnych webových aplikáciách.





Čo je to progresívna webová aplikácia?

Progresívne webové aplikácie sú webové aplikácie, ktoré ponúkajú používateľom bežnú stránku, ale zobrazujú sa ako natívna mobilná aplikácia. PWA sa pokúšajú priniesť použiteľnosť natívnej mobilnej aplikácie do sady moderných funkcií prehliadača, pričom naplno využívajú pokroky v oboch vývojových oblastiach.





Čo teda definuje PWA?

  • Univerzálne : PWA musí fungovať bezproblémovo (dobre, takmer) pre každého používateľa, bez ohľadu na jeho prehliadač.
  • Reaguje : PWA by mali fungovať s akýmkoľvek zariadením, napríklad s prenosným počítačom, tabletom, smartfónom a podobne.
  • Dizajn : dizajn by mal napodobňovať pôvodné mobilné aplikácie, čo znamená efektívne a ľahko dostupné ponuky s jednoduchou interaktivitou pre pokročilé funkcie.
  • V bezpečí : PWA by mali používať HTTPS na zaistenie bezpečnosti užívateľských dát.
  • Zistiteľné: používatelia môžu nájsť PWA a dajú sa ľahko identifikovať ako aplikáciu (nie ako „web“).
  • Zapojenie: PWA musí mať prístup k natívnym funkciám zapojenia, ako sú napríklad push notifikácie.
  • Aktualizácie: PWA zostávajú aktuálne a slúžia najnovším verziám služby alebo webu.
  • Inštalácia: umožňujú používateľom jednoducho „nainštalovať“ PWA na svoju domovskú obrazovku bez toho, aby potrebovali obchod s aplikáciami.
  • Zdieľanie: PWA vyžadujú na zdieľanie iba jednu adresu URL bez akejkoľvek inštalácie.

Ako vidíte, cieľom PWA je poskytnúť používateľom úplný zážitok z webových stránok so zjednodušenými funkciami a dizajnom rozhrania natívnej aplikácie.



Ako funguje progresívna webová aplikácia?

Kľúčom k progresívnym webovým aplikáciám sú pracovníci servisu prehliadača.

Servisný pracovník je skript, ktorý beží na pozadí vášho prehliadača „oddelene od webovej stránky a otvára dvere funkciám, ktoré nepotrebujú webovú stránku ani interakciu používateľa“. Môžete použiť napríklad servisných pracovníkov push notifikácie a synchronizácia na pozadí v súčasnosti, ale bezprostredná budúcnosť PWA dáva týmto skriptom väčšiu silu.





Servisní pracovníci ako také tvoria základ štandardu PWA a používajú webovú vyrovnávaciu pamäť na takmer okamžité výsledky.

Pred servisnými pracovníkmi bol skript vyrovnávacej pamäte prehliadača spustený ako Application Cache (alebo App Cache). Cache aplikácií je k dispozícii v širokej škále prvých offline služieb, ale bola trochu náchylná na chyby. App Cache má navyše niekoľko známych obmedzení, ako A List Apart vysvetľuje.





Ale hlavným problémom pre vývojárov je nedostatok priamej interakcie s presne tým, ako AppCache funguje, čo bráni vývojárom presne riešiť problémy hneď, ako vzniknú. Webové stránky a služby s plnou offline funkciou boli zase riskantnou voľbou.

Servisní pracovníci však vydržia iba tak dlho, ako je potrebné. V PWA, keď na niečo kliknete alebo použijete funkciu, servisný pracovník vstúpi do akcie. Servisný pracovník (pamätajte, že je to skript) spracuje udalosť a rozhodne, či požiadavku môže dokončiť offline vyrovnávacia pamäť. Ide o to, že pre PWA je na výber niekoľko offline vyrovnávacích pamätí, ktoré poskytujú oveľa širšiu škálu offline funkcií.

Cache navyše nie je len na zvýšenie rýchlosti offline. Môžete napríklad zamieriť do PWA, ale vaše pripojenie je veľmi nerovnomerné. Servisný pracovník obsluhuje predchádzajúcu vyrovnávaciu pamäť, plne funkčnú, bez prerušenia vašich skúseností.

Progresívna podpora webového prehliadača

Na používanie progresívnej webovej aplikácie existujú dve požiadavky: kompatibilný prehliadač a služba s povolením PWA.

Najprv sa pozrime na prehliadače. Máte dve možnosti, ako skontrolovať podporu prehliadača PWA. Prvým je Jakea Archibalda Je servisný pracovník pripravený ? ktorý šikovne zobrazuje stav hlavných prehliadačov pripravených na PWA a internet Samsung.

Podrobnejší prehľad podpory prehliadača PWA by ste mali navštíviť Môžem použiť , webová stránka, ktorá sa špecializuje na zoznam implementácií rôznych webových a prehliadačových technológií podľa verzie prehliadača. Ak napríklad do vyhľadávacieho panela zadáte „pracovníci služby“, nájdete tabuľku s číslom verzie, s ktorou každý prehliadač implementoval pracovníkov služby PWA.

Tabuľka Môžem použiť servisných pracovníkov potvrdzuje, že všetky hlavné prehliadače podporujú PWA. Tiež ilustruje podporu PWA pre niekoľko alternatívnych desktopových prehliadačov a mobilných prehliadačov.

Rozobrať to trochu viac:

  • Desktopový prehliadač (plná podpora): Chrome, Firefox, Opera, Edge, Safari
  • Desktopový prehliadač (čiastočná podpora/zastaraná verzia): Prehliadač QQ, prehliadač Baidu
  • Mobilný prehliadač (plná podpora): Chrome, Firefox, Safari, UC Browser, Samsung internet, Mint Browser, Wechat
  • Mobilný prehliadač (čiastočná podpora/zastaraná verzia): Prehliadač QQ, prehliadač Android, Opera Mobile

Všetky hlavné prehliadače teda podporujú PWA. Microsoft Edge a Safari sú najnovšími doplnkami k úplnému zoznamu podpory. Naopak, prehliadač QQ aj prehliadač Baidu teraz používajú zastarané verzie a ako také sa dostali do druhej vrstvy.

Ako nájsť a nainštalovať progresívnu webovú aplikáciu

Teraz, keď viete, ktorý prehliadač použiť, môžete premýšľať nad vyhľadaním a inštaláciou PWA. V tomto prípade budem používať Samsung Galaxy S8 s prehliadačom Google Chrome.

Progresívne webové aplikácie sú všade. Mnoho spoločností prispôsobilo svoje stránky a služby tak, aby ponúkali verziu progresívnej webovej aplikácie. V mnohých prípadoch sa s PWA prvýkrát stretnete, keď prejdete na domovskú stránku alebo mobilný web služby, ktorý spustí Pridať na domovskú obrazovku dialógové okno.

Pozrite sa na video nižšie, aby ste zistili, čo sa stane, keď navštívite Mobilná stránka Twitter .

Navštíviť nespočetné množstvo stránok a dúfať, že sa vám zobrazí spúšťač domovskej obrazovky, samozrejme nie je užitočné. V skutočnosti je to časovo veľmi náročné. Našťastie to nemusíte robiť, pretože existuje niekoľko stránok zameraných na katalogizáciu PWA.

Najprv skús outweb . Uvádza celkom slušný rozsah PWA a často sa objavujú nové možnosti. Ďalej vyskúšajte pwa.rocks. Má menší výber, ale niekoľko praktických PWA, ktoré budete chcieť pridať do svojho zariadenia.

V januári 2019 bol navyše prehliadač Chrome 72 pre Android dodávaný s dôveryhodnou webovou aktivitou (TWA). TWA umožňuje otvorenie kariet Chromu v samostatnom režime. Na druhej strane to umožňuje fungovať PWA v obchode s aplikáciami Google Play. Prvých niekoľko PWA, ktoré sa objavili v službe Google Play, bolo Twitter Lite , Instagram Lite a Google Maps Go , pričom viac sa bude zobrazovať v priebehu času.

Galéria obrázkov (2 obrázky) Rozbaliť Rozbaliť Zavrieť

Nahradia progresívne webové aplikácie pôvodné aplikácie?

Progresívne webové aplikácie sú vynikajúcim hybridným krokom medzi vašim prehliadačom a natívnou mobilnou aplikáciou. Nahradia PWA úplne pôvodné aplikácie? To je odo mňa ťažké nie. PWA sú skvelé ako jednoduchá ponuka, ale vzhľadom na to, že sa v súčasnosti zameriavajú predovšetkým na replikáciu existujúcich webov a služieb, nenahradia natívne aplikácie.

Aspoň zatiaľ nie.

zastaviť kód zlý systém konfiguračné informácie windows 10

PWA však fungujú. Údaje dostupné v štatistikách PWA to tiež potvrdzujú. Tu je niekoľko zaujímavých čísel, ktoré ilustrujú, ako PWA menia naše interakcie s bežne používanými webovými stránkami:

  • Spoločnosť Trivago zaznamenala 150 -percentný nárast zapojenia používateľov, ktorí si pridali svoje PWA na domovskú obrazovku.
  • Domovská stránka Forbes PWA sa úplne načíta za 0,8 sekundy, pričom počet zobrazení na návštevu je až 10 percent. Forbesov PWA tiež zaznamenal dvojnásobné dĺžky relácií používateľov.
  • Twitter Lite zaznamenal 65 -percentný nárast stránok na reláciu, pričom masívny 75 -percentný nárast tweetov. Je tiež interaktívny „za menej ako 5 sekúnd cez 3G“.
  • Alibaba zaznamenala 76 -percentný nárast mobilných konverzií.

PWA ešte nie sú hlavným prúdom. Ale s obrovskou škálou výhod, ktoré poskytujú, ako napríklad úspora miesta vo vašom zariadení, o nich v budúcnosti ešte budete počuť.

zdieľam zdieľam Tweet E -mail Príručka pre začiatočníkov k animovanej reči

Animovaná reč môže byť výzvou. Ak ste pripravení začať pridávať dialógy do svojho projektu, proces za vás rozložíme.

Čítajte ďalej
Súvisiace témy O autorovi Gavin Phillips(945 publikovaných článkov)

Gavin je juniorský editor pre Windows a vysvetlené technológie, pravidelný prispievateľ do skutočne užitočného podcastu a pravidelný recenzent produktov. Má súčasné písanie BA (Hons) s digitálnymi umeleckými postupmi vyplenené z kopcov Devonu a viac ako desať rokov profesionálnych skúseností s písaním. Má rád veľa čaju, stolné hry a futbal.

Viac od Gavina Phillipsa

prihlásiť sa ku odberu noviniek

Pripojte sa k nášmu bulletinu a získajte technické tipy, recenzie, bezplatné elektronické knihy a exkluzívne ponuky!

Kliknutím sem sa prihlásite na odber