Progressive Web App med WordPress: fordele og ulemper

4 Min.
Progressiv web-app WordPress

Vores bureaupartner giftGRÜN har bygget en Progressive Web App (kort: PWA) med WordPress til universitetshospitalet RWTH Aachen, som understøtter onboarding af nye medarbejdere. Vi talte med Patrick Heinker om fordele og ulemper ved PWA'er i forhold til websites og native apps.

Sådan fungerer en Progressiv Web App

Patrick, hvordan kører en PWA helt præcist, og hvad med datahåndtering?

Indholdet vedligeholdes i WordPress og udgives via normale skabeloner. En ServiceWorker leverer offlinefunktionaliteten. Når siden åbnes første gang, downloader ServiceWorker en zip-fil med alle siderne, som genereres på serversiden.

Når en side kaldes op, vises den side, der allerede er i cachen, nu. Og ServiceWorker tager sig af opdateringen i baggrunden, så der vises nyt indhold ved næste besøg, hvis noget er ændret. Du kan eventuelt også genindlæse efter en opdatering, men det har ikke været nødvendigt i vores brugssituation.

PWA WordPress
Skærmbilleder fra Progressive Web App til RWTH Aachen University Hospital

Datalagringen er helt offline, kun for videoer og eksternt indhold kræves der en internetforbindelse.

PWA vs. indfødt app

Hvad er forskellene, men også fordelene i forhold til native apps?

Native apps er platformsspecifikke, ofte komplekse og derfor dyre at implementere. Desuden skal de distribueres via de officielle butikker for at få en stor rækkevidde. PWA'er kan derimod installeres direkte ved besøg på webstedet med et tryk på en knap.

Apple er dog stadig en smule bagud med understøttelsen af PWA-funktioner. Men det er ikke noget nyt blandt webudviklere, at Safari ikke understøtter ting, som har været almindelige i andre browsere i årevis...

Hvordan fungerer interaktionen mellem Progressive Web App med WordPress ?

Vi bruger WordPress til vedligeholdelse af data, men også til skabeloner. Det er et normalt websted med den eneste forskel, at indholdet gøres tilgængeligt offline via en JavaScript ServiceWorker. Og at den opfører sig næsten som en native app.

Der er også mulighed for at bruge REST API'et på WordPress og rendere alting på klientsiden, som det ville være normalt i native apps. I vores brugssituation så vi dog kun en ekstra indsats her, hvilket næppe giver nogen fordele.

Implementer Progressive Web App med WordPress

Hvad er tilgangen, hvis du vil implementere en Progressive Web App med WordPress ?

Der findes nogle Plugins, som gør det muligt at omdanne en side til en Progressive Web App ved et tryk på en knap og nogle få indstillinger. Der findes også push-notifikationstjenester, som kan bruges til at give alle blogbesøgende besked om nye indlæg. Disse færdige Plugins er dog snarere beregnet til at gøre en normal blog offline-egnet og til at indlæse målrettede filer.

Efter at have leget med nogle af disse Plugins , valgte vi vores egen løsning. Vi byggede vores funktionalitet separat fra Plugins for f.eks. at tillade fuldstændig indlæsning af sideindhold via en servergenereret zip-fil og for at være mere fleksible med hensyn til tilpasning af funktioner. Push-meddelelser er normalt kortlagt via betalte tjenester, men kan lige så let bygges internt.

PWA'er: kompatibilitet og databeskyttelse

Hvad er de potentielle faldgruber, og hvordan løste du dem? Og hvad med spørgsmålet om databeskyttelse?

Som sædvanligt med webudvikling: hver browser fungerer anderledes, og det skal testes grundigt på alle enheder. Apple nægter at understøtte PWA-funktionaliteten fuldt ud og har igen sine egne Apple-specifikke metatags til at få appen til at fungere, som afviger fra standarden.

Cachelagringsmodellen bør vælges, så den passer til den pågældende brugssituation. ServiceWorkers kan udgive sider, der er gemt i millisekunder, og opdatere dem i baggrunden. Men hvis jeg er på en nyhedsside, vil brugeren måske foretrække at se en lille venteliste, indtil det seneste indhold er indlæst.

Databeskyttelse var en af hovedårsagerne til, at vi valgte en PWA. Brugernes indhold og læringsforløb holdes helt offline. Serveren kan aldrig se, hvilken bruger der kalder hvad, da der ikke er nogen loggede brugere. Det er derfor umuligt at spore, om en ny medarbejder har arbejdet sig igennem det hele eller ikke engang har installeret appen.

Fordele og ulemper ved systemerne

Hvordan beslutter du for hver kunde, hvilken teknologi der er bedst egnet til et sådant projekt?

Der er applikationer, som kun kan implementeres via en native app. Hvis en kunde f.eks. absolut vil have push-meddelelser på en iPhone, er der ingen anden mulighed end native push-meddelelser. På den anden side er produktionen af PWA'er også betydeligt billigere end en native app på grund af brugen af webteknologier og elimineringen af al håndtering af butikker. Selvfølgelig spiller det disponible budget også en afgørende rolle.

Har du andre PWA-projekter i støbeskeen, som du kan fortælle os om endnu?

En masse - men vi vil ikke afsløre dem endnu 😉 Bare dette: Der kan gøres store ting med PWA'er i e-handelssektoren.

Et par ord om dig og dit bureau?

giftGRÜN er det digitale bureau i GRÜN-koncernen. Vores koncern er den førende udbyder af donations- og medlemsadministrationssystemer på markedet i Tyskland. De fleste af vores projekter handler om at etablere et samlet system for vores kunder, dvs. at forbinde vores ERP-system med websites.

Vi laver en masse grænsefladearbejde og udvikler også vores egen WordPress Themes . Vores team består af designere, front- og backendlers og projektledere. Vores favorit hoster er selvfølgelig fra Münster 🙂

Dine spørgsmål om Progressive Web Apps

Hvilke spørgsmål har du om Progressive Web Apps? Du er velkommen til at bruge kommentarfunktionen. Vil du gerne holdes underrettet om nye artikler om WordPress og WooCommerce ? Så følg os på Twitter og Facebook, LinkedIn eller via vores nyhedsbrev.

Kommentarer til denne artikel

Skriv svar på en

Din e-mailadresse vil ikke blive offentliggjort. Obligatoriske felter er markeret med *.