Sok fejfájást okoz minden leendő weboldal-tulajdonosnak az a tény, hogy a felhasználók számos különböző eszközről és számos különböző módon szeretnék elérni az oldalukat. Ki kell szolgálniuk a mobilos és tabletes felhasználókat épp úgy, mint az asztali gépen böngésző látogatókat. A legköltséghatékonyabb megoldás létrehozni egyetlen, minden eszközre optimalizált weboldalt; egy hagyományos weboldalból azonban hiányzik számos, a mobilalkalmazásokban elérhető funkcionalitás, ami növeli a konverziós, a vevőmegtartási és visszatérési arányokat.

E két opció között létezik azonban egy harmadik út, a progresszív webalkalmazás (progressive web application, a továbbiakban PWA), ami biztosíthatja azokat a funkciókat, amikre egy hagyományos mobilalkalmazás képes, méghozzá anélkül, hogy szükség volna egy különálló mobil app lefejlesztésére.

A PWA előnyei

A progresszív webalkalmazás a hagyományos weboldal és a mobilalkalmazás keveréke. Lényegében minden weboldal kibővíthető egy progresszív webalkalmazássá, ami telepíthető a felhasználó eszközére, egy kattintással megnyitható az alkalmazás ikonjára kattintva a kezdőképernyőn, kitölti a teljes képernyőt, küldhet értesítéseket, működhet internetkapcsolat nélkül, és általánosságban ugyanazt a felhasználói élményt nyújthatja, mint egy hagyományos mobilalkalmazás.

A natív mobilalkalmazásokkal ellentétben egy PWA – bár hozzáadható a Google Play vagy az Apple App Store kínálatához – nem csak az alkalmazásboltokból, hanem a böngészőből, az oldalra látogatva is telepíthető, valamint automatikusan frissíti önmagát. Egy PWA a motorháztető alatt, a böngészőből fut, de a helyes konfigurációval a felhasználó szemszögéből ez észrevehetetlen, és a PWA megkülönböztethetetlen egy hagyományos mobilalkalmazástól.

A PWA-k továbbá különösen gyors teljesítményt nyújtanak, mivel modern webtechnológiákra épülnek, mint az úgynevezett Service Worker. Ez egy olyan háttérfolyamat, amely a böngészőben fut, és segíti az offline működést és a gyors betöltést azzal, hogy képes előtölteni és tárolni az alkalmazás erőforrásait.

Több mint parancsikon?

Amikor először hallottam a PWA fogalmáról, megkérdeztem a szoftverfejlesztő mentoromat, hogy ez miben több annál, minthogy újra feltalálták a parancsikont, ami ezúttal a mobilon egy weboldalra mutat. És valóban, a progresszív webalkalmazás legelemibb funkciója, hogy elhelyezhetünk egy, a weboldalra mutató parancsikont a készülék képernyőjén, ami képes teljes képernyős módban, a böngésző vezérlőelemei nélkül megnyitni a weboldalt. De a PWA ennél sokkal többre is képes.

A legfontosabb tulajdonsága, hogy az alkalmazás optimalizálható az internetkapcsolat nélküli vagy gyenge internetkapcsolattal való használatra. A felhasználók internet nélkül is böngészhetik a statikus tartalmakat, a blogbejegyzéseket vagy akár még egy webshop termékkészletét is. Akár külön oldalakat is tervezhetünk az offline felhasználóknak. A Service Worker technológia azt is lehetővé teszi, hogy az adatszinkronizálás egy későbbi időpontban fusson, így a felhasználók offline is feltölthetik az adatokat a távoli adatbázisba, amit az alkalmazás az internetre való kapcsolódás során fog továbbítani a szervernek; például a kívánságlistájukra helyezhetnek egy terméket, amit az alkalmazás megjegyez az eszközön, és akkor továbbítja azt az adatbázis felé, amikor az eszköz az internetre csatlakozik.

A PWA-k továbbá használhatják a mobileszközök számos funkcióját: értesítéseket küldhetnek, elérhetik a kamerát, a mikrofont és a GPS-t, és adatszinkronizációt futtathatnak a háttérben, hogy mindig naprakészek legyenek az alkalmazásban tárolt adatok.
A legújabb technológiák pedig további lehetőségeket tartogatnak a PWA-k számára. A Google által fejlesztett WebGPU technológia, ami már elérhető a legújabb Chrome verziókban, lehetővé teszi, hogy a böngészők közvetlenebb hozzáférést kapjanak a grafikai hardverekhez, amit kihasználva jelentősen gyorsabban és hatékonyabban tudják megjeleníteni a 3D grafikákat, és végrehajtani a komplex számításokat. Ez az új lehetőségek teljes tárházát nyitja meg a webes alkalmazások számára, beleértve a bonyolult grafikai játékokat, a virtuális valóság alkalmazásait, valamint a gépi tanulást. A WebGPU segítségével a PWA-k olyan komplex grafikai és hardverigényes feladatokat is végrehajthatnak, amelyek korábban csak natív alkalmazásokra voltak jellemzőek.

Tehát a telepíthetőség és a parancsikon létrehozása valóban a PWA-k egyik fő funkciója, de az csupán a jéghegy csúcsa, aminél sokkal többre is képesek a progresszív webalkalmazások.

Néhány népszerű példa

  • A Spotify 2019-ben adta ki a nagy népszerűségnek örvendő progresszív webalkalmazását. Elsősorban azért választották ezt a technológiát, hogy megkerülhessék a tranzakciónkénti 30%-os jutalékot, amit az Apple követelt azért cserébe, hogy az alkalmazás megjelenhessen az App Store-ban. A prémium Spotify előfizetők elmenthetik a zenéiket az eszközükre a PWA technológia offline megoldásain keresztül. A Spotify PWA kiadását követően a konverziós ráta (az előfizetők százalékos aránya az összes felhasználóhoz mérten) 26.6%-ról 46%-ra ugrott.
  • A Pinterest 2017-ben tért át a PWA technológiára, ami jelentős javulást eredményezett a kulcsfontosságú mutatókban. A Pinterest a mobil felhasználói élmény javítása érdekében fejlesztette ki a PWA-t, különösen a lassú sávszélességű környezetekben és korlátozott adatcsomaggal rendelkező felhasználók számára. A projekt eredményei lenyűgözőek voltak: a heti aktív felhasználók száma 103%-kal nőtt éves szinten, az alkalmazásban átlagosan eltöltött idő hossza 296%-kal, az új felhasználók száma pedig 843%-kal nőtt.
  • Az Alibaba, a globális e-kereskedelem kínai óriása szintén sikeresen alkalmazta a PWA technológiát. A PWA integráció után a konverziós ráták 76%-os növekedését tapasztalták; a „Hozzáadás a kezdőképernyőhöz” felszólításnak köszönhetően megnégyszereződött a visszatérések aránya a PWA felhasználói körében; az aktív felhasználók aránya pedig 30%-kal nőtt Androidon és 14%-on az iOS eszközökön.
  • Úgyszintén a PWA technológiát használja többek között a Starbucks, annak érdekében, hogy a felhasználók offline is böngészhessék a kínálatot és hozzáadhassák a termékeket a kosarukhoz, valamint az Uber, hogy a felhasználók gyenge internetkapcsolat mellett is igénybe vehessék a szolgáltatásukat.

A PWA hátrányai

A PWA-k azonban számos fontos hátránnyal is járnak. Mindenekelőtt egyes böngészők nem, vagy csak részlegesen támogatják. A Firefox teljesen lemondott a PWA technológia támogatásáról, az iOS rendszereken levő Safari pedig még nem támogat egy-két fontosabb funkciót (mint az automatikusan felugró telepítési felhívást). A Chrome és a legtöbb Chromium-alapú böngésző (Brave, Microsoft Edge) azonban teljes mértékben támogatják a technológiát.

Úgyszintén hátrány, hogy ez a fajta alkalmazás kevésbé ismert a felhasználók körében, mint a hagyományos mobilalkalmazások. Ez ugyanakkor egy olyan probléma, ami orvosolható a felhasználók tájékoztatásával, az alkalmazásboltok pedig lehetővé teszik a progresszív webalkalmazások feltöltését is, amivel növelhető a PWA felfedezhetősége.

Továbbá a követelményektől függően roppant komplex és erőforrás-igényes feladat lehet az alkalmazás internetkapcsolat nélküli funkcióinak megvalósítása. A PWA-ba való átmenet – amennyiben csak az alapvető funkciókat kívánjuk használni – viszonylag egyszerű. A különböző tartalomkezelő rendszerek, mint a WordPress vagy a Shopify, egy plugin feltelepítésével és némi konfigurációval elintézik ezt; és az egyedi fejlesztésű oldalaknál sem sokkal bonyolultabb az átmenet. De a technológia teljes képességének kiaknázása (főként az offline funkciók megvalósítása) sokkal nagyobb feladat, és ha egy, már létező weboldalba szeretnénk beépíteni ezeket a funkciókat, az jelentős újrafejlesztést is megkövetelhet.

A PWA jövője

Bár a progresszív webalkalmazás nem olyan ismert és széles körben használt, amennyire a natív mobilalkalmazások, a technológia mégis megállás nélkül fejlődik. A Google Chrome fejlesztői folyamatosan dolgoznak azon, hogy bővítsék a képességeit, és bár jelentős lemaradással, de a Safari fejlesztői is pótolják a böngésző hiányosságait (a legújabb verzió már az értesítések küldését is engedélyezi).

Hátrányai ellenére a PWA technológia számos előnnyel rendelkezik, amelyek lehetővé teszik a vállalatok számára, hogy javítsák a felhasználói élményt, növeljék a konverziós rátákat és alacsonyabb fejlesztési költségek mellett rendelkezzenek saját mobilalkalmazással.