Waarom kiezen voor een PWA: Progressive Web Mijn App uitgelegd

Written by Jerome Granados on Maandag 3 Mei 2021

In ons vorige artikel hadden we het over de groeiende invloed van mobiel op ons gebruik, ook op de desktop, een invloed die wordt geïllustreerd door een nieuw concept, Progressive Web Apps. Vandaag gaan we onze bronnen gebruiken om de elementen die deze PWA's kenmerken en de manier waarop ze werken nader te bekijken.

Progressive Web Apps trekken als concept steeds meer aandacht, omdat ze enerzijds het beste van het web en anderzijds van native apps lenen, en de kloof tussen native apps en webapps overbruggen.
Het succes van native apps is te danken aan het feit dat ze een groot aantal middelen samenbrengen om de meest complete gebruikerservaring op mobiel te leveren, zowel wat betreft visuele weergave als functionaliteit. Ze hebben echter te maken met beperkingen die inherent zijn aan hun technologie, hun API en sommige van de elementen waaruit ze bestaan, in termen van gebruikersbetrokkenheid, met het struikelblok van verwijzingen, waardoor het vaak moeilijk is voor gebruikers om hun App te ontdekken, evenals de noodzaak om door de installatiehandeling en hun API te gaan. Progressive Web App (PWA) zijn bedoeld om deze obstakels te overwinnen, terwijl ze tegelijkertijd convergeren met wat Mijn App doet.

De voordelen en het concept van Progressive Web App (PWA)

De belangrijkste reden waarom iedereen achter native apps aanzit, is dat deze een grotere betrokkenheid in een kortere tijd bieden. Apps bieden ook een uitstekende gebruikerservaring, wat cruciaal kan zijn voor het merkimago.

Maar waarom zou u kiezen voor een Progressive Web App (PWA) in plaats van een native app?
Hier zijn een paar goede redenen:

Een enkele programmeercode, minder duur in onderhoud;
Compatibiliteit/schaalbaarheid met andere platformen. Bijvoorbeeld de integratie van een "Super App", of nieuwe besturingssystemen zoals Harmony OS of elk ander platform dat een compatibele browser kan bieden;
Frictieloze overgang tussen het web en de native ervaring via promo's of installatie call-to-actions voor uw terugkerende klanten;
Indexering van Inhoud door Zoeken: het is SEO-vriendelijk.
Tot slot biedt de Progressive Web App een consistente omnichannel ervaring.

Om de specifieke kenmerken van Progressive Web Apps beter te begrijpen, moeten we beginnen met de principes die aan het concept ten grondslag liggen, met andere woorden hoe een Progressive Web App 1) betrouwbaar, 2) snel, 3) boeiend moet zijn. Vanaf dit punt kunnen we zien dat een Progressive Web App (PWA) in de eerste plaats een gebruikerservaring is. Dus met de gebruiker in gedachten wenden ontwikkelaars zich tot een reeks webgebaseerde technologieën, hulpmiddelen en beste praktijken om nieuwe normen vast te stellen voor Terug, op het web en op alle schermen.

Voor een inleiding tot de technologische bijzonderheden van PWA's spraken we met Jean-Mathieu, Angular-ontwikkelaar bij GoodBarber:

Betrouwbaar

Een van de belangrijkste kenmerken van een Progressive Web App is de mogelijkheid om offline te werken. Voor de gebruiker betekent dit het vermijden van de gevreesde foutmelding als er geen verbinding of onvoldoende netwerk is.

Om inhoud aan de offline gebruiker te leveren, vertrouwt een PWA eerst en vooral op de app-shell, die het mogelijk maakt om de structuur van de pagina op te roepen, zelfs als de Inhoud niet reageert, bijvoorbeeld de Kop en een bepaalde lay-out, en om het laden te illustreren, zodat de gebruiker op de hoogte is dat er iets gebeurt. Dit is een verbetering ten opzichte van de foutmelding die de gebruiker tot nu toe op weg stuurde.

Om de look en feel van native apps te evenaren, moet het Ontwerp van een Progressive Web App bovendien adaptief zijn. Responsive design is daarom essentieel voor een Progressive Web App (PWA), ongeacht de gebruikte technologie. Voor de gebruiker zorgt het voor een naadloze overgang van het ene apparaat naar het andere, ongeacht de schermgrootte, en altijd met het oog op betrouwbaarheid.

Snel

Bovendien vertrouwt een Progressive Web App op een worker service die als rol heeft om de Inhoudstroom in de cache op te slaan vanaf de eerste keer dat de app geladen wordt. Dit betekent dat de inhoud na het eerste bezoek ook offline toegankelijk is, inclusief artikelen en artikeldetails.

Het door Google geïntroduceerde RAIL-model: Reageren / Animeren / Inactief / Laden

Dit gedrag voldoet aan de eisen van het door Google geïntroduceerdeRAIL-model: Respond / Animate / Idle / Loading. Met andere woorden, een Progressive Web App moet reageren op het verzoek van de gebruiker, een animatie weergeven om de gebruiker te laten wachten, de relatieve inactieve tijd tijdens het laden gebruiken om zoveel mogelijk Inhoud in de cache op te slaan, en uiteindelijk in minder dan een seconde laden! Met zulke ambities is het gemakkelijk te begrijpen waarom steeds meer webspelers het fenomeen Progressive Web Apps omarmen.

betrekken

Terwijl de installatie van een native Toepassen een valkuil kan zijn (extra verplichtingen voor de gebruiker), maken Progressive Web Apps van de installatie een echte bonus. Op een mobiele telefoon of tablet worden gebruikers uitgenodigd om de applicatie op hun beginscherm te installeren, als ze dat willen. Deze "installatie" wordt mogelijk gemaakt door het app manifest, dat browsers informatie stuurt zoals het splashscreen (of de kleur die moet worden weergegeven voor het startscherm), de weergave in Liggend of beide, en tot slot de optie voor de app om volledig onafhankelijk van de browser te draaien.

Progressive Web Apps vormen ook een uitdaging voor native apps op het gebied van pushmeldingen. Terwijl Push meldingen tijdens de programmeerfase worden geïntegreerd, wordt de werking ervan later onderdeel van de Lijst van Achtergrond taken van de service worker. Tot nu toe worden pushmeldingen voor PWA's ondersteund in Chrome, Firefox, Opera en Safari op de desktop, maar niet op mobiel in het geval van Safari. Deze terughoudendheid van Apple kan worden toegeschreven aan het feit dat Progressive Web Apps stevige concurrentie zijn voor native apps. Wordt vervolgd...

Tot slot maken Progressive Web Apps deel uit van de trend naar steeds veiliger surfen op het web, met de server-side eis om HTTPs te gebruiken, dus het is gemakkelijk te zien waarom PWA's zich op het kruispunt bevinden tussen het beste van desktop en mobiel surfen. Het is ook vermeldenswaard dat HTTPS binnenkort de standaard wordt voor apps in de App Store. Dus hoewel dit een extra vereiste kan zijn voor ontwikkelaars, is het er niet één die zal verhinderen dat Progressive Web App (PWA) in de toekomst kan concurreren met native apps.

Als we één sleutelelement zouden moeten aanwijzen om de Progressive Web Apps-revolutie te definiëren, dan zou dat zeker de service worker zijn. Zoals Jean-Mathieu het samenvat, is het de service worker en zijn taken op de Achtergrond die push-meldingen, offline, caching, enz. beheren, allemaal functies die Progressive Web Mijn App onderscheiden. En niet te vergeten de voor de hand liggende verwantschap (geen woordspeling bedoeld) met mobiel, want een Progressive Web App is vooral ook een native 'look and feel' voor de gebruiker.

Voor meer informatie biedt Google hier zijn Checklist van Progressive Web Apps functies.

Meer Inhoud over Progressive Web App (PWA):

VOOR MEER INFORMATIE:

Met GoodBarber kunt u een hulpmiddel maken dat is aangepast aan elk type scherm en kunt u uw werk Icoon vinden op alle Type apparaten. Of u nu uw werk wilt vinden op uw tablet, uw iOS- of Android-mobiel of uw computer, het is allemaal mogelijk! Om u te helpen kiezen tussen een Progressive Web App (PWA) of een native applicatie, kunt u een kijkje nemen in ons artikel - misschien had u nog niet eens aan de web app optie gedacht!
De technologie is volop in ontwikkeling en het einde is nog niet in zicht! Als werknemer hebt u misschien besloten om uw eigen native applicatie of PWA (Progressive Web App) te maken. Nou, het goede nieuws is dat u uw Progressive Web App nu ook op iOS kunt vinden! Dit betekent dat u uw werk op het scherm van uw mobiele apparaat kunt installeren, en dat u uw werk ook op uw computer kunt vinden, bijvoorbeeld met Chrome.
Als werknemer hebt u er misschien voor gekozen om een webapplicatie te ontwikkelen in plaats van een native applicatie. Dankzij deze optie kunt u het Icoon van uw app op uw mobiel vinden, maar ook op uw computerscherm, op het web! Als u meer wilt weten over deze technologie, bekijk dan de compatibiliteit van functies voor uw Progressive Web App (PWA) afhankelijk van de Navigatie.
Als u wilt beginnen met het ontwikkelen van een app, is het belangrijk om bekend te zijn met de technologie die u wilt gebruiken! Lees ons artikel om alles te weten te komen wat u moet weten over een service worker voor bijvoorbeeld een mobiele applicatie! Dankzij dit aan het netwerk gekoppelde hulpmiddel zal uw Progressive Web App (PWA), die compatibel is met zowel uw mobiele als uw computerscherm, zich onderscheiden van Overige websites op Navigatie, zoals Chrome. Lees ons artikel om alles te weten te komen over dit onderwerp en hoe u een Progressive Web App (PWA) installeert!
Met GoodBarber kunt u kiezen tussen het ontwikkelen van een native applicatie en een PWA, een webapplicatie, die beide compatibel zijn met iOS- en Android-apparaten. Om meer te weten te komen en u te helpen bij het maken van uw keuze, ontdekt u de kracht van de URL bij het promoten van uw Progressive Web App.