Maak van Progressive Web App (PWA) uw beste vriend

“PWA is een revolutionair voor webontwikkeling. Het helpt uw ​​productiviteit te verhogen door een geweldige gebruikerservaring te bieden die de voordelen van zowel web- als mobiele apps combineert tegen minimale kosten. ”
Een handdruk is een goede gewoonte

Een shake met PWA houdt uw klant betrokken. En PWA staat altijd klaar om je beste vriend te worden, waarom sturen we dan geen vriendschapsverzoek naar PWA?

Het is tijd om een ​​goede stap te zetten in de richting van de PWA en ik zal uitleggen hoe je vriendschap voor jou ten goede komt met PWA!

Verwar niet met PWA

Om sommige redenen denken veel mensen dat PWA's Single Page Applications (SPA) zijn.
Dit is fout, echt heel erg fout (met statuscode 400 ).

Een SPA kan een PWA zijn, maar een PWA hoeft geen SPA te zijn.

PWA werkt graag met iedereen samen

Website gebouwd op elk framework of bibliotheek zoals ReactJs, Angular, VueJS of zelfs in HTML kan een PWA zijn.

In de eenvoudigste bewoordingen is een Progressive Web-app een mobiele website die is getransformeerd met extra functies en functionaliteiten die een app-achtig gevoel geven. Het werkt met een exemplaar van Browser en maakt gebruik van servicemedewerkers om een ​​soepele werking te garanderen, zelfs zonder een betrouwbare internetverbinding.

Als je een mythe hebt dat PWA een Google-technologie is, zijn deze stukjes informatie voldoende om je mythe te wissen. Progressive Web Apps zijn gebaseerd op webstandaarden. Het werkt met elke browser en elk platform.

Het is dus een website, maar het voelt als een native mobiele app, met een splash-scherm, aangepast laadscherm, vloeiendere animaties, pushmeldingen en geen navigatiebalk. Uw gemiddelde eindgebruikers kunnen het een mobiele app noemen.

Progressive Web Applications zijn websites die aan drie technische eisen moeten voldoen:

  • Moet worden bediend met HTTPS (beveiligd)
  • Zorg voor een geldig webmanifestbestand met een minimale specifieke set pictogrammen
  • Moet een geldige servicemedewerker en minimale offline ondersteuning registreren

Nergens in die vereisten staat dat de website JavaScript moet gebruiken. Kortom, u moet de servicemedewerker registreren met behulp van client-side JavaScript.

PWA ondersteunt functies zoals hieronder:

  • Vastzetten op een startscherm - We kunnen ons webapp-pictogram toevoegen aan een startscherm.
  • Pushmeldingen - We kunnen pushmeldingen integreren zoals in een native app via Push API en Notification API voor het web.
  • Splash-scherm - Een manifestbestand beheert het splash-scherm voor uw PWA voor betrokkenheid zoals een native app
  • Geolocatie - We hebben toegang tot de huidige locatie van de gebruiker via de Geolocation API
  • Offline werkmodus - Vanwege de servicemedewerker die het cachemechanisme beheert, krijgen we een rijke gebruikerservaring, zelfs als er geen internet is.
  • Toegang tot mediafuncties - We hebben toegang tot microfoon-, video- en camera-apparaten. Implementeer ook video- en audio-oproepfunctionaliteit met behulp van WebRTC API.

Over het algemeen hoeft u geen afzonderlijke mobiele app voor hetzelfde project te ontwikkelen als aan uw vereisten wordt voldaan met de functies van PWA. Het betekent dat PWA nog steeds moeite heeft om de functies van sommige native apps te bieden.

Ja, dat is een wow-moment voor webontwikkelaars. Andere handige functies zijn al onderweg. PWA kijkt er al naar uit om native app-achtige functies te bieden. Laten we eens kijken naar die functies die ons echt zullen helpen.

PWA ondersteunt in de toekomst de volgende functies zoals:

  • Bluetooth - Web Bluetooth API is in ontwikkeling en we zullen binnenkort toegang krijgen tot Bluetooth op het webplatform.
  • Sensoren - Sensoren zijn een heel belangrijk onderdeel van het huidige ontwikkeltijdperk. Sommige sensoren zijn al in ontwikkeling, zoals omgevingslichtsensor, naderingssensor, versnellingssensor, magnetometersensor en een gyroscoopsensor.
  • Native Sharing - We kunnen het native sharing-mechanisme van het apparaat gebruiken als onderdeel van de Web Share API.
  • Vingerafdruksensor - We kunnen gebruikers authenticeren via de vingerafdruksensor met behulp van de Web Authentication API. Maar is het nog in ontwikkeling vanwege veiligheidsredenen.

Waarom neemt iedereen tegenwoordig PWA aan?

Na het lezen van enkele statistieken van grote bedrijven die de PWA gebruiken, kent u de kracht van PWA en begrijpt u duidelijk waarom iedereen voor PWA wil gaan.

Hier wil ik je enkele gegevens laten zien van PWA-casestudy's van populaire bedrijven:

  • Twitter ontwikkelde in april 2017 de Twitter Lite Progressive Web App en in het resultaat verhoogt Twitter het aantal pagina's per sessie met 65%, verzonden tweets met 75% en het bouncepercentage met 20%.
  • Flipkart, de grootste e-commerce-site van India, besloot om de app-only-strategie in 2015 af te sluiten. Daarna kwamen ze met Flipkart Lite, aangedreven door PWA en je zult versteld staan ​​van de geweldige resultaten. Gebruikers brachten meer tijd op de site door met een snelheid van 3x, re-engagementpercentages zijn 40% hoger, 70% hogere conversieratio onder degenen die aankomen via het Toevoegen aan startscherm en 3x lager datagebruik in vergelijking met de native app.
  • Alibaba.com, 's werelds grootste online B2B handelsplatform. Alibaba.com kwam met een nieuwe strategie als PWA om een ​​geweldige gebruikerservaring te bieden voor zowel eerste bezoekers als terugkerende bezoekers. Hun nieuwe strategie kwam met verrassende resultaten. Alibaba.com kreeg 76% hogere conversiepercentages in alle browsers, kreeg 4% meer maandelijkse actieve gebruikers op iOS & 30% op Android en 4x hogere interactieratio van Toevoegen aan startscherm.

Ja, dat is ongelooflijk en we moeten de schoonheid van de Progressive Web-app accepteren. Nu begrijp je, waarom ik je dwing om PWA je beste vriend te maken.

Play Store is klaar om PWA's te publiceren

Ja ja ja! Play Store en PWA's zijn nu vrienden geworden. Nu kunnen we PWA's in Play Store publiceren met behulp van Trusted Web Activities (TWA). Google Chrome 72 heeft Trusted Web Activities toegevoegd ter ondersteuning van webweergave op volledig scherm zonder URL of browser-gerelateerde elementen weer te geven. U kunt dus een APK van uw web-app genereren en deze naar Play Store uploaden met behulp van Android Studio en enige kennis van Android-ontwikkeling.

Hier raad ik je aan onderstaande video te bekijken voor gedetailleerde kennis van TWA:

Het bestaan ​​van PWA's zoals Facebook Lite, Instagram Lite, Flipkart Lite en Twitter Lite maakt meestal gebruik van WebView en geeft ons een app-achtig gevoel. Maar houd er rekening mee dat Apple nog steeds geen ondersteuning biedt voor TWA.

Uiteindelijk kunnen we zeggen dat PWA een goede en kosteneffectieve benadering is om onze web-apps te ontwikkelen. Het is zeker een toekomst van webontwikkeling. We hopen dat PWA ons in de toekomst meer van dienst is.

Klap klap klap! Omdat klappen een goede gewoonte is