Mik azok a progresszív webes alkalmazások, és hogyan telepíthetek egyet?

Mik azok a progresszív webes alkalmazások, és hogyan telepíthetek egyet?

Az alkalmazások uralják a telefont. Az alkalmazások sokáig nem befolyásolták ugyanúgy az asztalt vagy a böngészőt. Ez megváltozott az elmúlt években. A progresszív webes alkalmazások (PWA -k) egyre nagyobbak, és megváltoztatják a mindenféle webhelyekkel való interakciónkat.





De mi is pontosan a progresszív webes alkalmazás? Mit tesz egy PWA, amit egy webhely nem? Íme, mit kell tudni a progresszív webes alkalmazásokról.



Mi az a progresszív webes alkalmazás?

A progresszív webes alkalmazások olyan webes alkalmazások, amelyek rendszeres webhelyet kínálnak a felhasználóknak, de natív mobilalkalmazásként jelennek meg. A PWA -k megpróbálják a natív mobilalkalmazás használhatóságát a modern böngésző funkciókészletbe hozni, teljes mértékben kihasználva mindkét fejlesztési terület előnyeit.





Akkor mi határozza meg a PWA -t?

  • Egyetemes : A PWA -nak zökkenőmentesen kell működnie (nos, majdnem) minden felhasználó számára, függetlenül a böngészőjétől.
  • Fogékony : A PWA -knak minden eszközzel együtt kell működniük, például laptoppal, táblagéppel, okostelefonnal stb.
  • Tervezés : a kialakításnak utánoznia kell a natív mobilalkalmazásokat, vagyis áramvonalas, könnyen megtalálható menüket, egyszerű interaktivitással a fejlett funkciókhoz.
  • Biztonságos : A PWA -knak HTTPS protokollt kell használniuk a felhasználói adatok védelmére.
  • Felfedezhető: a felhasználók megtalálhatják a PWA -kat, és könnyen azonosíthatók alkalmazásként (nem „webhelyként”).
  • Eljegyzés: A PWA -nak hozzá kell férnie a natív elköteleződési funkciókhoz, például a push értesítésekhez.
  • Frissítések: A PWA -k naprakészek maradnak, és kiszolgálják a szolgáltatás vagy webhely legújabb verzióit.
  • Telepítés: lehetővé teszik a felhasználók számára, hogy egyszerűen „telepítsék” a PWA -t a kezdőképernyőjükre, anélkül, hogy alkalmazásboltra lenne szükségük.
  • Megosztás: A PWA -k csak egyetlen URL -t igényelnek megosztáshoz, telepítés nélkül.

Amint láthatja, a PWA -k célja, hogy a felhasználók teljes weboldal -élményt nyújtsanak a natív alkalmazás áramvonalas funkcióival és felületének kialakításával.



Hogyan működik a progresszív webes alkalmazás?

A progresszív webalkalmazások kulcsa a böngészőszervizben dolgozók.

A szervizmunkás egy olyan szkript, amely a böngészője hátterében fut, „elkülönítve egy weblaptól, és megnyitja az ajtót olyan funkciók előtt, amelyek nem igényelnek weboldalt vagy felhasználói beavatkozást”. Használhat olyan szervizmunkásokat, mint pl push értesítések és háttér szinkronizálás jelenleg, de a PWA közvetlen jövője nagyobb hatalmat ad ezeknek a szkripteknek.



Mint ilyenek, a szervizmunkások képezik a PWA szabvány alapját, a webes gyorsítótár használatával szinte azonnali eredményeket érnek el.

A szervizmunkások előtt a böngésző gyorsítótárának parancsfájlja az Application Cache (vagy az App Cache) volt. Az App Cache számos offline szolgáltatást kínál, de kissé hibára hajlamos. Ezenkívül az App Cache számos jól ismert korlátozással rendelkezik, mint pl A lista külön magyarázza.



De a fejlesztők fő problémája az AppCache működésével való közvetlen interakció hiánya, ami megakadályozza, hogy a fejlesztők pontosan javítsák a felmerülő problémákat. Viszont a teljes offline funkcionalitással rendelkező webhelyek és szolgáltatások kockázatos választásnak bizonyultak.

A szervizmunkások azonban csak addig tartanak, amíg cselekvésük szükséges. A PWA -ban, ha rákattint valamire vagy használ egy funkciót, egy szervizmunkás lép működésbe. A szervizmunkás (ne feledje, ez egy szkript) feldolgozza az eseményt, és eldönti, hogy az offline gyorsítótár képes -e befejezni a kérést. Az ötlet az, hogy a PWA számára számos offline gyorsítótár áll rendelkezésre, amelyek sokkal szélesebb körű offline funkciókat biztosítanak.

Ezenkívül a gyorsítótár nem csak az offline sebességnövelésre szolgál. Például egy PWA -hoz megy, de a kapcsolat rendkívül foltos. A szervizmunkás a korábbi gyorsítótárat szolgálja ki, teljesen működőképesen, anélkül, hogy megzavarná az élményt.

Progresszív webalkalmazás -böngésző támogatás

A progresszív webalkalmazás használatának két feltétele van: egy kompatibilis böngésző és egy PWA-kompatibilis szolgáltatás.

Először nézzük a böngészőket. Két lehetősége van a PWA böngésző támogatásának ellenőrzésére. Az első Jake Archibaldé Készen áll a szervizmunkásokra ? amely jól mutatja a főbb böngészők PWA-kész állapotát, valamint a Samsung internetet.

A PWA böngésző támogatásának részletesebb áttekintéséhez nézze meg Használhatom , egy weboldal, amely a különböző webes és böngészőtechnológiák megvalósításának böngészőverziók szerinti felsorolására specializálódott. Például, ha a „szervizmunkások” kifejezést írja be a keresősávba, egy táblázatot talál, amely megjeleníti annak a verziószámát, amellyel minden böngésző megvalósította a PWA szolgáltatási dolgozókat.

A Használhatom a szervizmunkásokat táblázat megerősíti, hogy a főbb böngészők mindegyike támogatja a PWA -kat. Ezenkívül bemutatja a PWA támogatását számos alternatív asztali és mobil böngészőhöz.

Kicsit lebontva:

  • Asztali böngésző (teljes támogatás): Chrome, Firefox, Opera, Edge, Safari
  • Asztali böngésző (részleges támogatás/elavult verzió): QQ böngésző, Baidu böngésző
  • Mobil böngésző (teljes támogatás): Chrome, Firefox, Safari, UC böngésző, Samsung internet, Mint böngésző, Wechat
  • Mobil böngésző (részleges támogatás/elavult verzió): QQ böngésző, Android böngésző, Opera Mobile

Tehát a főbb böngészők mindegyike támogatja a PWA -kat. A Microsoft Edge és a Safari a legutóbbi kiegészítések a teljes támogatási listához. Ezzel szemben mind a QQ Browser, mind a Baidu Browser elavult verziókat használ, és mint ilyenek a második szintbe estek.

Progresszív webalkalmazás keresése és telepítése

Most, hogy tudja, melyik böngészőt használja, gondolkodhat a PWA keresésén és telepítésén. Ebben a példában Samsung Galaxy S8 -at fogok használni a Google Chrome -mal.

A progresszív webes alkalmazások mindenhol megtalálhatók. Sok vállalat úgy alakította át webhelyeit és szolgáltatásait, hogy progresszív webes alkalmazást kínáljon. Sok esetben először találkozik PWA -val, amikor a kezdőlapra vagy a mobil szolgáltatási webhelyre lép, ami kiváltja a Hozzáadás a kezdőképernyőhöz párbeszédablak.

Nézze meg az alábbi videót, hogy mi történik, amikor meglátogatja a Twitter mobil webhely .

Természetesen számtalan webhely felkeresése és a kezdőképernyő aktiválásának reménykedése nem hasznos. Valójában kifejezetten időigényes. Szerencsére ezt nem kell megtennie, mivel van néhány webhely, amely a PWA -k katalogizálására szolgál.

Első próba kifelé . A PWA -k elég tisztességes sorát sorolja fel, gyakran új opciókkal. Ezután próbálja meg a pwa.rocks programot. Kisebb választéka van, de néhány praktikus PWA -t szeretne hozzáadni az eszközéhez.

Továbbá 2019 januárjában az Androidhoz készült Chrome 72 megbízható webes tevékenységet (TWA) szállított. A TWA lehetővé teszi, hogy a Chrome lapok önálló módban nyíljanak meg. Ez viszont lehetővé teszi, hogy a PWA -k megjelenjenek a Google Play alkalmazásboltban. Az első néhány PWA a Google Playen jelent meg Twitter Lite , Instagram Lite és Google Maps Go , idővel több megjelenési lehetőséggel.

Képgaléria (2 kép) Kiterjed Kiterjed Bezárás

A progresszív webes alkalmazások helyettesítik a natív alkalmazásokat?

A progresszív webes alkalmazások kiváló hibrid lépés a böngésző és a natív mobilalkalmazás között. A PWA -k teljesen helyettesítik a natív alkalmazásokat? Ez egy kemény nem tőlem. A PWA -k könnyű kínálatként nagyszerűek, de mivel jelenleg túlnyomórészt a meglévő webhelyek és szolgáltatások reprodukálására összpontosítanak, nem helyettesítik a natív alkalmazásokat.

Legalábbis egyelőre nem.

hogyan kell szavakat hozzáadni a tiktokhoz

A PWA -k azonban működnek. A PWA Stats -nál rendelkezésre álló adatok ezt is alátámasztják. Íme néhány érdekes szám, amely illusztrálja, hogy a PWA -k hogyan változtatják meg a gyakran használt webhelyekkel való interakcióinkat:

  • A Trivago 150 százalékkal növelte az elkötelezettséget azoknál a felhasználóknál, akik PWA -jukat adták hozzá a kezdőképernyőhöz.
  • A Forbes „PWA” kezdőlapja teljesen betöltődik mindössze 0,8 másodperc alatt, míg a látogatásonkénti megjelenítések száma 10 százalékkal nő. A Forbes PWA a felhasználói munkamenetek hosszát is megkétszerezte.
  • A Twitter Lite 65 százalékkal nőtt az oldalak száma munkamenetenként, a tweetek száma pedig 75 százalékkal. Ez is interaktív 'kevesebb, mint 5 másodperc alatt 3G -n keresztül'.
  • Az Alibaba 76 százalékkal nőtt a mobil konverziókban.

A PWA -k még nem mainstreamek. Az általuk nyújtott előnyök széles skálájával, például helytakarékossággal a készüléken, a jövőben többet fog hallani róluk.

Részvény Részvény Csipog Email Kezdő útmutató a beszéd animálásához

A beszéd animálása kihívást jelenthet. Ha készen áll arra, hogy párbeszédet adjon hozzá a projekthez, lebontjuk a folyamatot.

Olvassa tovább Kapcsolódó témák A szerzőről Gavin Phillips(945 megjelent cikk)

Gavin a Windows és a Technology Explained junior szerkesztője, rendszeresen közreműködik a Valóban hasznos podcastban, és rendszeres termékértékelő. BA (Hons) kortárs írással és digitális művészeti gyakorlatokkal rendelkezik a devoni domboktól, valamint több mint egy évtizedes szakmai írói tapasztalattal rendelkezik. Rengeteg teát, társasjátékot és focit szeret.

Továbbiak Gavin Phillips -től

Iratkozzon fel hírlevelünkre

Csatlakozz hírlevelünkhöz, ahol technikai tippeket, véleményeket, ingyenes e -könyveket és exkluzív ajánlatokat találsz!

Feliratkozáshoz kattintson ide