De tijd waarin bedrijven separate apps moesten ontwikkelen voor zowel iOS als Android ligt ondertussen ver achter ons. Met behulp van zogeheten hybride apps kunnen ontwikkelaars vanaf een enkele code base beide platformen bedienen. Op deze manier besparen bedrijven kosten op het gebied van uren en kan één team beide platformen ontwikkelen. Er zijn veel verschillende frameworks die de filosofie van hybride apps hanteren, maar wat zijn de krachten van de verschillende opties? In dit artikel kijken we naar de voordelen van Flutter, React Native en Ionic (in combinatie met Capacitor).
Geschreven door Bart Wesselink, Head of Development
Laten we beginnen met de meest recente uit het rijtje: Flutter. Flutter is in 2017 door Google uitgebracht en maakt gebruik van de simpele programmeertaal Dart, eveneens ontwikkeld door Google. De taal heeft veel weg van talen als Java(Script). In Flutter worden applicaties opgebouwd op basis van widgets. Die widgets kun je gebruiken om bijvoorbeeld standaardcomponenten (knoppen, afbeeldingen) toe te voegen, of je eigen widgets te stylen.
Aan de achterkant heeft Flutter een laag die deze widgets omzet in een visuele weergave. Deze worden weergeven op een canvas. Met deze tekenlaag kan Flutter een uitstekende en snelle user experience bieden. Zodra de gebruiker interactie heeft met een widget, wordt dit via diezelfde laag teruggekoppeld naar de bijbehorende widget. Vaak heeft deze interactie weer effect op de weergave van de widgets, welke weer door de tekenlaag geregeld wordt.
Naast deze tekenlaag bevat Flutter ook een laag waarmee ontwikkelaars kunnen communiceren met native services, zoals de camera of de locatiegegevens. Flutter zorgt ervoor dat de resultaten hiervan weer terug bij de widgets komen, zodat die hier mee aan de slag kunnen.
Een andere optie is React Native. React Native is in 2015 ontwikkeld door Facebook, en is grotendeels gebaseerd op het ReactJS framework voor het ontwikkelen van webapplicaties. De applicaties worden opgebouwd op basis van een hiërarchische componenten.
React Native draait op JavaScript middels een zogeheten bridge. Deze bridge in React Native zorgt ervoor dat componenten uit JavaScript omgezet worden naar hun bijbehorende native variant, waardoor je dus ook native performance krijgt op deze componenten. Tevens zien alle componenten er standaard herkenbaar uit, omdat ze overeenkomen met de stijl van het systeem op het platform.
Ook andere platform-specifieke modules praten met de JavaScript-engine via deze bridge, om zo toegang te krijgen tot bijvoorbeeld push notificaties.
Als laatste hebben we Ionic in combinatie met Capacitor. Ionic zelf biedt de mogelijkheid om met HTML en CSS native componenten na te bootsen, en draait op Capacitor. Capacitor zorgt ervoor dat de web applicaties draaien binnen de context van een app. In de eerste versies van Ionic werd vaak nog Cordova als motor achter de app gebruikt, echter leverde dat de nodige problemen op, waardoor Ionic ervoor heeft gekozen om met een alternatief te komen: Capacitor. Het verschil tussen de twee zit met name in het feit dat bij Cordova de code voor de apps telkens opnieuw wordt gegenereerd, daar waar dit bij Capacitor onderdeel van het project is. Dit vereist wat meer platformkennis, maar zorgt over het algemeen voor minder problemen tijdens het bouwen van de apps.
Bij Ionic draaien alle apps binnen een zogeheten ‘web view’, een mini-browser binnen een app. In dit web view kunnen applicaties alle moderne frameworks gebruiken, zoals Angular, React of Vue. Zo kunnen web ontwikkelaars dus ook eenvoudig aan de slag met app development, zonder dat daar aparte kennis voor vereist is. Een ander gevolg van deze architectuur, is dat het makkelijk is om de applicatie ook als website beschikbaar te maken, middels een zogeheten progressive web app.
Ook bij Ionic met Capacitor gaat communicatie met het besturingssysteem via een bridge die ervoor dat plugins met het systeem kunnen communiceren, hoewel veel functionaliteiten ondertussen ook reeds beschikbaar zijn in de browser, denk bijvoorbeeld aan de camera die websites al kunnen gebruiken. Hoewel een web view niet de performance kan leveren van een native app, zijn moderne webtechnieken ondertussen zover dat het verschil nauwelijks te merken is.
Alle drie technieken hebben hun eigen voor- en nadelen, wat inhoudt dat er meestal geen zwart-wit antwoord te geven is op de vraag welke het beste is. Een betere vraag is, welke techniek werkt het beste in deze situatie? Benieuwd naar wat dit antwoord hierop voor jou is? Neem dan contact met ons op!
Benieuwd naar wat we voor jou kunnen betekenen? Of kun je iets voor ons betekenen? Dan horen we graag van je! Bel of mail gerust. We komen graag langs om kennis te maken. En natuurlijk staan onze deuren op de zevende verdieping van de Javatoren in Almelo ook altijd voor je open.
