Laten we, om de beste manieren te ontdekken om een Progressive Web App te ontwikkelen, onthouden wat het betekent:
Een PWA combineert de functionaliteiten van een site, een internet en een native applicatie.
Dankzij verbeterde webstandaarden ondersteunen browsers nu de Service Worker en het Web App Manifest. Het is daarom mogelijk om zonder internet door een site te bladeren, zowel op mobiel als op computer, zoals een applicatie. De mogelijkheid om via de browser notificaties te ontvangen en de site als applicatie toe te voegen aan het startscherm maakt websites nu nog dichter bij het gedrag van native applicaties.
Een groot nadeel van de sites was hun langere navigatie door elke pagina op aanvraag te downloaden in vergelijking met de onmiddellijke weergave van native applicaties. Nu alle bestanden kunnen worden geback-upt en surfen zonder internet mogelijk is, is dit verschil duidelijk teniet gedaan door het echte gevoel van snelheid.
Kleine flat : als u een toepassing wilt maken waarvan de prestaties worden verbeterd door grafische afbeeldingen en berekeningen (videogame, ..), moet u rekening houden met native ontwikkeling die altijd sneller zal zijn op het clientapparaat.
Kortom, een PWA is een site die is ontwikkeld met behulp van standaard webtechnologieën (HTML, CSS en Javascript) maar die zich in alle opzichten gedraagt als een native applicatie.
#Ontwikkelingshulpmiddelen:
Als je ervoor kiest om je site te ontwikkelen of over te zetten naar een PWA, afhankelijk van het project, zijn hier enkele van de tools die momenteel het populairst zijn:
Reageren :
https://fr.reactjs.org/
Een javascript-framework uitgegeven en onderhouden door Facebook.
Deze tool staat bekend als lichter en flexibeler dan Angular. Je kunt onderweg functies toevoegen en relatief vrij zijn in het organiseren van de code, maar ontwikkelingsbeperkingen hebben vaak de voorkeur in grotere teams.
Een voordeel is dat het leren van dit framework je ook in staat stelt om ReactNative (van Facebook) te leren kennen, waardoor het native applicaties kan maken.
Angular :
https://angular.io/
Het framework ontworpen en onderhouden door Google. Framework zegt "zwaar" in de zin dat het de ontwikkeling voldoende beperkt en vanaf het begin wordt geleverd met een reeks javascript-functies.
Voors en tegens : Interesse voor groeiende teams en/of langlopende projecten omdat de code goed op orde moet zijn. Het inbedden van Typescript gaat ook in die richting, omdat het op korte termijn langer duurt om in Typescript te schrijven dan in javascript, maar de code zal beter leesbaar zijn en fouten zullen gemakkelijker te detecteren zijn.
Vue.js :
https://vuejs.org/
Open-source framework gemaakt door een voormalige Google-ontwikkelaar. Dit framework is nieuwer en is de afgelopen jaren enorm gestegen, vanwege de zogenaamde eenvoud en goede prestaties. Op dezelfde manier als React, komt deze tool op een lichte manier en stelt u in staat om javascript-bibliotheken toe te voegen terwijl u doorgaat met uw project.
Ionic :
https://ionicframework.com/
Een raamwerk voor het ontwikkelen van hybride apps en PWA's. Via een Webview maakt Ionic het mogelijk om met webtechnologieën een applicatie op de winkel te krijgen. Het is ook mogelijk om PWA's te ontwikkelen met dit platform dat ook React en Angular ondersteunt.
Polymeer :
https://www.polymer-project.
Ontwikkeld door Google, Polymer is een javascript-bibliotheek voor het maken van webapplicaties. Dichter bij webstandaarden maar minder populair; het is mogelijk om de mogelijke toekomst van het web te volgen via deze technologie die de bestaande taal pusht in plaats van zich aan een raamwerk te conformeren.
Lighthouse :
https://developers.google.com/
Tool ontwikkeld door Google om de verschillende PWA sliders van een website te meten. Dit kan erg handig zijn tijdens de ontwikkeling van PWA-functionaliteiten (offline browsen, prestatietesten, enz.).
Goede ontwikkeling!
Maxime, Full Stack@UX-Republic-ontwikkelaar
