PWA – Vad är det?

PWA – Vad är det?

Det finns väl i stort sett inget företag som inte har en app (eller iaf pratat om att utveckla en app).
Ett alternativ till en app kan vara en PWA (Progressive Web App). En ofta mer snabbutvecklad och ekonomisk lösning – men inte nödvändigtvis ett sämre alternativ!

Så vad är en PWA?
Utan att dyka ner i tekniska definitioner kan man säga att en PWA är en websida som ser ut och fungerar som en nativ app (en app du installerat via ex Play Store).

För ett enkelt exempel: surfa till https://deanhume.github.io/beer/  från din smartphone.
Så enkelt är det!
Så vad är det som avslöjar att den här websidan är en PWA? Frågan längst ner om du vill lägga till sidan på din hemskärm! Väljer du att göra det kommer du därefter åt PWAn på samma sätt som vilken annan installerad app som helst.

Användaren använder alltså sin browser, surfar till en url och tada! – landar direkt i en PWA.
Ingen nedladdning eller installation behövs.
Även om du inte surfade från en smartphone fungerar sidan lika bra på desktop och tablets också.

En vanlig webapp fungerar inte alls utan internetuppkoppling. En PWA har däremot ett offline-mode så att den alltid är tillgänglig för användaren.
Den kan också, bland annat, leverera push-notifieringar* och synka data i bakgrunden.
*push-notifieringar stöds inte på iOS (ännu?)

PWAs har inte (ännu) fullt stöd för att interagera med viss hårdvarufunktionalitet.
Vad som stöds och inte kan man få en bra överblick på här:
https://whatwebcando.today/

PWAs är beroende av olika tekniker för att fungera, ex Manifest, Web Workers, Local Storage och Session Storage.
Om du vill grotta ner dig i teknik och fakta så kolla på wiki här: https://en.wikipedia.org/wiki/Progressive_web_applications ?

Tekniken som en PWA byggs på är oftast javascript. Vanliga ramverk & bibliotek att använda är exempelvis React, Angular, Vue och Polymer.
Alltså används en och samma kodbas för samtliga plattformar, samma PWA används oavsett om användaren kommer från en smartphone, tablet eller desktop. Med hjälp av bl.a. responsive web design anpassas gränssnittet efter enhet.

En nativ app skrivs i språk som är anpassade efter typen av enhet, för android används främst Java och för iOS används oftast Objective-C (det finns andra alternativ men för att hålla det kort ?)
En nativ app har också tillgång till enhetens API:er och hårdvarufunktionalitet.
En nativ app är inte “cross-platform compatible”. En app byggd för iOS kommer alltså inte fungera på en android.

Som med allt annat finns det alltså för- och nackdelar med PWAs.
Den kanske största nackdelen med en PWA är Apples motvilja att supporta tekniken. Men under 2018 har Apple lagt till support för Service Workers och Wep App Manifest, så det går framåt 🙂

några fördelar:

  • fungerar på smartphones, tablets och desktop
  • enklare att utveckla (en kodbas) – håller ner kostnaden
  • funkar utan internet
  • behöver inte laddas ner i en app-store
  • ser för användaren ut som en vanlig app (navigering etc.)
  • användaren behöver inte uppdatera för att innehåll och funktionalitet ska uppdateras
  • HTTPS skyddar användaren och håller PWA skyddade från hackare och annat trist
  • har åtkomst till mycket av enhetens inbyggda hårdvarufunktionalitet
  • man slipper kostnaden för att lägga upp en app i app-store
  • slipper processen med att få en app godkänd med de tekniska krav och riktlinjer varje app-store har. (exempelvis: Apple App Store guidlelines )
  • sökmotorerna hittar en PWA precis som vilken webapp/sida som helst
  • lätt att dela med andra användare (bara skicka en url)

Google håller på att skifta till ‘mobile-first indexing’. Det innebär att Google hanterar den mobila versionen av en websida som den primära sajten i sökresultaten. En PWA är indexerbar och mobilvänlig och kommer därmed troligtvis ge en bättre ranking än en ‘vanlig’ webapp och därmed göra det enklare för nya användare att hitta din app. En bättre förklaring om indexeringen hittar den vetgirige bl.a. på den här bloggen

några nackdelar med PWA:

  • tenderar till att dra mer batteri än en app
  • oftast långsammare än en native app
  • kan inte distribueras via en app-store
  • behöver en hosting-server
  • stödjer inte hårdvarufunktionalitet som t.ex. NFC och Geofencing
  • kan inte interagera med andra appar
  • stödet är fortfarande olika för olika enheter (android och iOS hanterar en PWA på olika sätt med olika restriktioner) se mer på https://whatwebcando.today/

Om du är nyfiken på att kolla närmare på PWAs live kan du spana in någon av följande:
instagram.com
pinterest.com
makemytrip.com
flikart.com

I Chrome 70+ kan du i Windows ‘installera’ PWAs på desktop (mac-användare får vänta till v72)
Mer info här https://developers.google.com/web/progressive-web-apps/desktop

Det är med andra ord inga små aktörer som ser fördelarna med PWA – tekniken är redan nu välbeprövad.

Eftersom appar har varit så otroligt populära att utveckla så har det gått lite inflation i hur många appar som erbjuds. Användarna orkar helt enkelt inte med fler appar ?
Även om många såklart använder nativa appar på sin smartphone – och lägger väldigt mycket tid på att använda dessa – så är det oftast samma 5 appar man använder (främst mail & sociala media). Man har helt enkelt tappat orken/intresset att ladda ner fler appar vilket gör det en allt svårare kanal att locka till sig användare i.
En stor fördel med en PWA är såklart att användaren hittar den via sökresultaten från ex. Google och sedan bara surfar dit.

Så vad ska man välja?
Båda lösningarna har sina för- och nackdelar. Det beror helt enkelt på vad som behövs och vad som är viktigt. PWA är relativt nytt medan appar är välbeprövat.
Vad som kan sägas är att utvecklingen och stödet för PWA går i en rasande takt framåt. Att utvecklingstiden för en PWA oftast är kortare och kräver mindre underhåll (en kodbas) gör det oftast till ett mer kostnadseffektivt alternativ. En PWA görs lätt tillgänglig och sökbar via Google och fungerar många fler plattformar (dator och smartphone).
En nativ app behöver oftast en webversion också för att fånga upp användare från desktop och tablets, så webutvecklingen kommer man ju inte undan då ändå 😉

Om ert företag är intresserad att veta mer om PWAs så kontakta oss!
?