Blog / Tjerk Dijkstra

Waarom ik ben gestopt met React Native

Written on:

Introductie

De belofte klinkt te mooi om waar te zijn. Ontwikkel in een Javascript framework voor twee platformen tegelijk: Android en iOS. Ik was altijd al een beetje sceptisch over een techniek zoals deze, hoe blijft het up to date met alle veranderingen die Google of Apple doorvoert op hun platformen? Op welke manier krijg je dezelfde resultaten op twee architecturen die erg verschillend zijn van elkaar? Met enige Javascript ervaring (Vue, React) gecombineerd met een aantal goede Swift ervaringen ben ik aan de slag gegaan.

Dependencies ⚠️

Als ik iets haat aan een nieuw framework dan is het wel NPM en de grote hoeveelheid afhankelijkheden in pakketten.
Voor het gebruik van de meest simpele functionaliteiten zijn kleine pakketten nodig die ieder weer een eigen versie hebben. De kans dat alles als een kaartenhuis in elkaar stort blijft per toevoeging maar groeien.

Struggles 🥲

Dus met de gedachtengang om zo weinig mogelijk packages te installeren kom ik direct voor een dilemma te staan.
Wat als eerste opvalt is dat de officiële documentatie een aantal belangrijke features (zoals Routing of Navigation) heeft overgelaten aan packages die ondersteund worden van de community. Dit betekent dat een blanco React Native project eigenlijk niet zoveel kan, dit is op zich geen probleem als de packages en implementaties maar makkelijk zijn, maar dit is niet het geval… helaas..

Navigation 🧭

Neem als voorbeeld de React Navigation. Het instellen voor zowel iOS als Android vereist al enige workarounds. Navigeren is namelijk fundamenteel verschillend per platform. React Native kiest voor de unisex oplossing, met als resultaat dat de standaard tabbed navigation op beide platformen niet lekker echt lekker werkt. De transities tussen de pagina’s zijn gepaard met een kleine vertraging en het gebruik van bijpassende systeem iconen is bij beide uitgesloten. Op deze manier ontkom je er niet aan om voor elk platform iets anders te programmeren… maar.. waarom dan niet gewoon native per platform?

Storage 💾

Dan nu de reden waarom ik de handdoek in de ring heb gegooid; lokale opslag. React heeft de support voor de aSyncStorage laten vallen, waarom? Ik zou het niet weten, mogelijk een transitie naar meer Firebase implementaties. Wat onder React Native developers razend populair lijkt te zijn. Het lokaal (on-device) kunnen opslaan van de data is voor mij als ontwikkelaar erg belangrijk, de privacy is gewaarborgd, ik hoef nooit een server te hosten of up te daten en de applicatie kan in principe voor eeuwig blijven draaien.

De enige optie om crossplatform op een simpele manier een key / value store te hebben is via deze package:

https://github.com/ammarahm-ed/react-native-mmkv-storage

Het vereist wat aparte instellingen voor iOs en Android die ik in beide gevallen doorlopen heb, alleen kan deze package niet builden op Android, door een issue die al eerder door iemand gespot is en een workaround voor gemaakt is, die nu niet meer geldig is, zie hier de reden voor mijn allergie voor het gebruik van zoveel dependancies.

Het verschil in React en React Native

Bij het Googlen van me vele problemen kwam ik vaak op perfecte oplossingen voor React die niet gelden voor React Native. Daarnaast zijn er een hele schot ontwikkelingen voor React niet meegenomen voor React Native omdat het simpelweg te moeilijk is om te implementeren voor beide platformen.

Lessons Learned

Mijn app (On Track, voorheen You From The Past) zit nog in een beta fase. In deze fase is het niet een wijze beslissing om cross-platform te ontwikkelen. Wanneer je met React Native begint moet je precies weten wat er moet gaan komen zodat jezelf beter kan voorbereiden op de mogelijk dependancies die je daarmee veroorzaakt.
Probeer ook na te denken over een gedeelde API of data structuur, dit zou al enorm helpen. Ik moet helaas voor dit project de handdoek in de ring gooien.