PWA

Progressive Web App

Progressive Web Apps (PWA) worden de laatste tijd steeds populairder. Volgens Google is het the next big thing in de ontwikkeling van het mobiele web, en duurt het niet lang meer voordat we ze overal terug gaan zien. Sterker nog: de kans is groot dat je al eens een PWA hebt gebruikt, want bedrijven met grote websites gebruiken al verschillende PWA-technieken.
In deze case lees je wat een Progressive Web App is, waarom het belangrijk is, en wat de voordelen zijn van een PWA zijn ten opzichte van native apps.

Wat is een Progressive Web App?

Als je wel eens een app hebt laten ontwikkelen, weet je dat dat lang niet altijd meevalt. Misschien heb je er zelfs slapeloze nachten van gehad. Het valt ook niet mee, wat je moet enorm veel keuzes maken: wordt het een app voor iOS, Android, of allebei? Voor welk platform ontwikkelen we eerst? Hoe vaak gaan we de app updaten, en hoe zorgen we ervoor dat de app niet in no-time ligt te verstoffen, achterhaald door nieuwe technologieën?

Met Progressive Web Apps wordt het ontwikkelen van apps voortaan een stuk eenvoudiger. Heel simpel gezegd is een PWA een website die zich gedraagt als een app. Dat wil zeggen dat je look and feel van een app combineert met de eenvoud van een website.

Wat het nog mooier maakt, is dat je met moderne browsers tegenwoordig ook een PWA op je home-scherm kunt installeren, push-notificaties kunt versturen en ze zelfs offline kunt gebruiken. Sommige ontwikkelaars voorspellen dat de PWA het eind van de native app betekent 1.

Het hele idee van een PWA is dat je je klant zo min mogelijk hordes laat nemen om bij je content te komen. Je verbetert de gebruikersbeleving, waardoor je klanten blijer zijn. En een blije gebruiker is goed voor je winst.

 

Het belang van een PWA

Tussen het opzoeken van een native app in een appstore en het daadwerkelijk gebruiken van de app, zit een aantal stappen. Uit onderzoek blijkt dat een app per stap gemiddeld 20% van z’n gebruikers verliest 2. Het installeren is een eerste horde, maar ook het openen van de app en het aanmaken van een account kost bijvoorbeeld gebruikers.

Dit probleem heb je bij een PWA niet. Als een gebruiker je PWA vindt, kunnen ze hem gelijk gebruiken. Dus geen gedoe met downloads en installaties. Gebruiken ze je PWA vaker, dan krijgen ze de mogelijkheid om de app te installeren en push-berichten te ontvangen.

Door de manier waarop een PWA gebouwd is, kan één app alle platforms bedienen. Dat scheelt niet alleen kosten in de ontwikkeling, maar ook in het onderhoud.

Kenmerken van een PWA

Laten we eerst naar het verschil tussen een native app en een PWA kijken. Een native app is een op zichzelf staand programma op je smartphone. Vergelijk het met een programma op je computer, zoals Photoshop of Word.

Een Progressive Web App is in de basis dus een website die zich gedraagt als mobiele app. Meer te vergelijken met Google Docs of Netflix. Je kunt er alles mee wat je met een native programma kunt, maar dan via je webbrowser. Je bent dus geen schijfruimte kwijt, hoeft niks te installeren of te updaten.

Daarnaast onderscheidt een PWA zich nog op een aantal andere manieren:

Een PWA is progressive

Het grootste nadeel van een traditionele app, is dat ze maar voor één platform geschikt zijn. Dat probleem heb je met een PWA niet. Dat komt omdat een PWA progressive is. Dat wil zeggen dat de app eerst de noodzakelijke content van een website laadt, en afhankelijk van de browser en internetverbinding van de gebruiker steeds meer lagen en functionaliteiten toevoegt. Dit maakt een PWA geschikt voor alle platforms, hoewel sommige oudere browsers misschien alleen de noodzakelijke content kunnen bekijken.

Een PWA is responsive

Je hebt vast wel eens gehoord van de term responsive webdesign. Dat betekent dat je een website ontwerpt die zich automatisch aanpast aan het apparaat waarmee een gebruiker je site bezoekt. Een PWA heeft responsive design nodig om op elk apparaat te kunnen werken. We kennen allemaal de websites waar je op je smartphone enorm moet inzoomen om de content te kunnen lezen. Die sites zijn dus niet responsive, en gelukkig zie je steeds minder.

PWA werkt ook offline

Zonder internet is het lastig om een website te bezoeken. Veel native apps zijn daarentegen nog wel te gebruiken als je geen of een slechte verbinding hebt. Met de Service Worker heeft Google ervoor gezorgd dat een PWA ook offline te gebruiken is. De Service Worker maakt het mogelijk om de data van een PWA van tevoren te cachen, zodat de app ook beschikbaar blijft als je geen internetverbinding hebt.

De voordelen van een PWA

Als je erover nadenkt om een app te laten ontwikkelen, is het belangrijk dat je weet welke voordelen een PWA heeft. Hieronder zetten we er een paar voor je op een rij.

  • Lift mee op de functionaliteiten van smartphones
    Smartphones worden steeds slimmer. Met een PWA kun je gebruikmaken van alle nieuwste technieken in een smartphone. Denk dan bijvoorbeeld aan GPS, de camera, een NFC-chip of de bewegingssensoren.

  • Overal toegang. PWA’s zijn gebaseerd op HTML5, wat ervoor zorgt dat ze praktisch altijd en overal beschikbaar zijn. Geen gedoe met een tekort aan opslagruimte grote downloads of ongeschikte apparaten. Het dagelijks gebruik van een app is ook stukken makkelijker te monitoren dan het gebruik van een native app.
  • Geoptimaliseerd voor zoekmachines. In tegenstelling tot de content in native apps, zijn PWA’s goed te indexeren door zoekmachines. Dat zorgt ervoor dat gebruikers die zoeken naar jouw content, of specifieke eigenschappen van je PWA, dat gewoon via Google en andere zoekmachines kunnen vinden. Daarnaast zijn PWA’s ook een stuk makkelijker te delen, want een PWA heeft z’n eigen URL.
  • Eenvoudig te updaten. Bij traditionele apps moeten gebruikers zelf de app updaten. Dat probleem heb je bij een Progressive Web App niet: ontwikkelaars kunnen nieuwe updates en functionaliteiten gewoon toevoegen aan de PWA. De volgende keer dat je gebruiker de app opent, zal hij aangenaam verrast zijn door de nieuwe functies, zonder het installeren van een update. Bij veiligheidsissues ben je dus ook niet afhankelijk van het feit of een gebruiker wel of niet besluit een update te installeren.

https://medium.com/javascript-scene/native-apps-are-doomed-ac397148a2c0

http://blog.gaborcselle.com/2012/10/every-step-costs-you-20-of-users.html

Waar een native app (nog) wint

Hoewel PWA’s de toekomst hebben, zijn ze nog niet op alle vlakken beter dan een native app.

  • Over het algemeen zijn native apps bijvoorbeeld nog net iets sneller dan een PWA. Dat komt omdat er bij een native app geen browser tussen de gebruiker en de app zit, die voor een klein beetje vertraging zorgt.
  • Betalen met je mobiele telefoon wordt steeds populairder. Dat gebeurt met Near Field Communication (NFC). Hoewel je met een PWA absoluut gebruik kunt maken van de NFC-chip in een smartphone, kun je die helaas nog niet gebruiken voor betalingen.

  • Sowieso zijn native apps ‘slimmer’. Ze kunnen bijvoorbeeld gebruikmaken van de sensoren in je telefoon, zodat ze zich automatisch aanpassen aan het licht in een ruimte. Of ze schakelen het scherm uit als je je telefoon ondersteboven neerlegt. Een PWA kan nog geen gebruikmaken van deze slimmigheden van je telefoon.
  • En hoewel je eerder las dat je het liefst zo min mogelijk stappen tussen het downloaden en gebruiken van je app wilt, is een app-store niet per se iets slechts. De kwaliteit van de apps wordt gewaarborgd, en je weet (bijna) zeker dat het veilig is.

 

X

Neem contact op met Hendrik Jan Hofstede


Hendrik Jan Hofstede

Meer weten?

Ben je nieuwsgierig geworden naar de mogelijkheden van een Progressive Web App voor jouw bedrijf? Neem dan contact met ons op, want we hebben er nog veel meer over te vertellen!

Mail Hendrik Jan