Når hjemmesider bliver til Apps

En PWA er helt simpelt en app, der er bygget på web-teknologi og fungerer som en hjemmeside. Det vil sige, at enhver hjemmeside kan sættes op til at fungere som en PWA. PWA står for Progressive Web App. Det lyder måske stadig lidt mystisk, men hvis du bryder det op, giver det et ret godt indblik i ideen, og hvad PWA egentlig er.

Progressiv
”Progressiv” beskriver de muligheder applikationen har. Det skal være muligt at bruge en PWA med et minimum af rettigheder på brugerens enhed (adgang til kamera, bluetooth osv.) Efter brugeren giver flere rettigheder til applikationen, skal flere funktioner låses op.

Men det er også her, at begrænsningerne i PWA kommer. Det er nemlig stadig en ny teknologi, og det er derfor ikke alle enheder og browsere, der understøtter dem 100 % endnu. PWA’en skal derfor kunne fungere så godt som muligt uden rettighederne. Derfor er det vigtigt, at den fungerer progressivt og låser op for funktioner (kamera, SMS’er osv.) løbende, når de bliver tilgængelige.

Web
Web-delen giver måske lidt sig selv, men det betyder bare, at den bygger på web- og browserteknologi. Dermed springer PWA mange skridt over på vejen til en app, og du slipper helt for besværet med at udvikle i et nyt programmeringssprog, fordi den er bygget med samme kode som bruges til at bygge hjemmesider. Det gør det nemt for alle, der allerede har erfaring med webudvikling at komme i gang med PWA’er.

App eller applikation
Det er det, der adskiller en PWA fra en hjemmeside. Den skal nemlig fungere som en selvstændig app, der lever udenfor browseren. Så tænk på det som en app som enhver anden, du har på din telefon bortset fra, at den ikke behøver at komme fra App Store eller Play Store.

Historien bag PWA

PWA er en terminologi, som blev opfundet og præsenteret af Google i 2015, men ideen med at sætte webudviklingen i centrum af appudvikling er ikke ny. Den blev allerede fremlagt i 2007 under lanceringen af en lille ide kaldet iPhone. Her er et citat fra dengang af Steve Jobs:

“(...) you can write amazing Web 2.0 and Ajax apps that look exactly and behave exactly like apps on the iPhone. And these apps can integrate perfectly with iPhone services. And guess what?

There’s no SDK that you need! You’ve got everything you need if you know how to write apps using the most modern web standards to write amazing apps for the iPhone today.

So developers, we think we’ve got a very sweet story for you. You can begin building your iPhone apps today" - Steve Jobs, Apple (WWDC 2007).

Sådan blev det ikke (i første omgang). Mindre end et år senere fortrød Steve Jobs sine udtalelser, en SDK (Software Development Kit) til iPhones blev annonceret og lige efter App Store. Og man kan godt forstå hvorfor, når man ser på App Stores omsætning.

Det frøs udviklingen af PWA i næsten et helt årti, men i 2015 annoncerede Google en ny teknologi i samarbejde med Microsoft, som valgte at droppe deres egen ide (Universal Windows Platform) for at støtte op om Googles ide om PWA.

Det ændrede ikke det store natten over, men langsomt begyndte Microsoft og Google at understøtte PWA i deres browsere. Safari, og dermed iOS, var noget langsommere, og vi skal helt frem til 2018, før de begyndte at understøtte bare helt basale PWA funktionaliteter. Selv den dag i dag (2023) mangler iOS flere af de funktioner, som de andre har haft i mange år.

Hvad kan en PWA i dag

PWA’er er i stand til at udføre en imponerende række opgaver i dag, og denne funktionalitet har været tilgængelig i noget tid. To gode kilder til at fremvise muligheder med PWA er:

• Demo af forskellige PWA-funktioner: Du kan eksperimentere med forskellige PWA-funktioner ved at besøge følgende side: https://whatpwacando.today/

• Liste over understøttede funktioner på din enhed: Hvis du vil se, hvilke specifikke funktioner din enhed understøtter, kan du besøge denne side: https://whatwebcando.today/

En PWA kan mange ting, men der er også nogle nutidige begrænsninger, som du skal være opmærksom på som fx Geofencing eller adgang til SMS’er og kontakter. Men selv med de begrænsninger ser jeg dagligt apps, som lige så godt kunne have været en PWA.

En af de store udfordringer ved PWA er, at Apple ikke har været hurtige til at understøtte alle funktioner. Derfor har det været nødvendigt at udvikle native apps, hvis man fx vil bruge notifikationer. Men i marts 2023 kom Apple med en opdatering til iOS, der endelig åbnede op for notifikationer fra PWA på iOS. Før det kunne iOS-brugere kun modtage notifikationer, hvis de hentede appen i App Store.

Så derfor er det stadig en ny teknologi, men med standarder defineret og udviklet af Google og Microsoft.

Hvor kan en PWA bruges, og hvem bruger den?

Enhver virksomhed med en hjemmeside har potentiale til at udnytte fordelene af en PWA. Dog giver det særlig mening for virksomheder med en tilstrækkelig kompleks hjemmeside – fx webshops, restauranter, nyhedsmedier og selvbetjeningsløsninger.

Her ville en PWA gøre det nemt for kunderne at få en app til deres yndlingswebshop, restaurant eller selvbetjening, så de nemt kan booke bord, se menuen, se deres ordrehistorik, modtage notifikationer om nye tilbud eller nyheder og ændre i deres profiler.

Virksomheder der har en PWA tæller bl.a. Spotify, Disney+ og Starbucks, men også mindre organisationer som Kløften Festival og Aarhus Festuge.

På den anden side er der situationer, hvor en PWA måske ikke er den bedste løsning. Det er fx:

• Spil: En PWA har begrænsninger, når det kommer til at levere avanceret 3D-grafik og komplekse spiloplevelser. Til krævende applikationer er native appudvikling ofte mere passende.

• Enkle informationshjemmesider: Hvis din hjemmeside primært fungerer som en simpel informationskilde uden interaktionsbehov, kan en simpel responsiv hjemmeside være tilstrækkelig.

I sidste ende afhænger valget om at implementere en PWA af din virksomheds specifikke behov og målgruppe. Det er vigtigt at overveje, hvilken type indhold og funktionalitet din hjemmeside kræver for at træffe den rette beslutning om, hvorvidt en PWA er den rigtige vej at gå.

Hvordan kan en PWA implementeres?

Det er vigtigt at forstå, at en PWA ikke erstatter en hjemmeside, men snarere udvider dens funktionalitet. En vellykket PWA kræver en velfungerende, responsiv hjemmeside som sin grundlæggende struktur.

At omdanne en hjemmeside til en PWA kræver ikke en omfattende indsats og bør være indenfor rækkevidde for enhver webudvikler med JavaScript-færdigheder. Alt, der kræves, er:

• En sikker HTTPS-forbindelse, som er standard for de fleste hjemmesider i dag, og som er afgørende for sikkerheden af både hjemmesiden og PWA’en.

• En manifestfil, der beskriver PWA’ens navn, ikon og lignende. Denne fil giver brugeren mulighed for at tilføje PWA’en til deres hjemmeskærm som en app, og den giver et konsistent udseende.

• En serviceworker JavaScript-fil, der indeholder koden til at håndtere PWA’ens adfærd, når den er offline. Dette kan omfatte at vise en fejlmeddelelse om manglende internetforbindelse eller opbevare ressourcer på enheden for hurtig adgang uden forbindelse.

Med disse relativt enkle trin kan enhver forvandle deres hjemmeside til en PWA og give deres brugerne en mere fleksibel og engagerende onlineoplevelse. Det er en effektiv måde at forbedre rækkevidden og funktionerne af ens hjemmeside.

Er PWA fremtiden indenfor appudvikling?

Det er min personlige overbevisning, at PWA vil spille en betydelig rolle i fremtidens appudvikling.

PWA vil ikke erstatte native apps fuldstændigt, da der stadig er mange scenarier, hvor native apps giver bedre mening. Men der er en betydelig mængde apps, der i virkeligheden fungerer som glorificerede hjemmesider. Disse apps kan ofte erstattes af langt mere omkostningseffektive PWAs, der tilbyder alle fordelene ved en appoplevelse uden de høje udviklings- og vedligeholdelsesomkostninger.