Als ich zum ersten Mal von React Native gehört habe, dachte ich mir nur “Meh, noch so ein Hybrid Framework.” Ich kannte bisher nur den Ansatz, eine Webseite in eine Webview zu packen und das dann als “Native” App zu verkaufen. Ich entwickle unglaublich gerne mit Webtechnologien und in den letzten Jahren ist sehr viel Tolles passiert. Aber eine Webseite als Mobile (oder sogar Desktop) App zu verkaufen war für mich nicht vorstellbar.
Einige Zeit später “musste” ich mich dann tiefer damit auseinandersetzen. Ich bekam eine halb fertige React-Native-App inklusive der offenen User Stories vorgesetzt – mit der Bitte, das Projekt abzuschließen. “Na gut”, dachte ich mir, “So schlimm wird’s schon nicht sein.” Außerdem habe ich ja bereits Erfahrung mit React und finde das Framework an sich recht genial. Der erste Blick in den Code machte mir das Projekt allerdings nicht unbedingt schmackhafter. Besonders abschreckend fand ich, dass “CSS” direkt im Javascript Code geschrieben wurde – dachte ich zumindest.
Der große AHA-Moment
Schon beim zweiten Blick habe ich festgestellt, dass es keinen einzigen `div` gibt, sondern nur `Views’ – und Text wird immer mit einer `Text`-Komponente eingebunden. Also habe ich mal die Docs und Google gefragt und stellte fest: React Native ist ja gar nicht so ein komisches “Webview-Hybrid-Web-App”-Framework. Das ist sehr viel näher am nativen Code als gedacht. Eine sehr positive Überraschung! Damit wird mir auch gleich klar, warum die Styles, welche im Endeffekt gar kein CSS sind, mit Javascript geschrieben werden. Es handelt sich nämlich nur um Style-Attribute der entsprechenden nativen Views.
Das Konzept ist eigentlich genial. React generiert im Grunde einen generischen Virtual-DOM der nicht aus Browser DOM-Elementen, sondern aus standard Javascript Objekten besteht. Erst die “render engine” macht dann im Browser DOM-Elemente daraus und verwaltet diese so effizient wie möglich.
Das User Interface wird also mit nativen Elementen gerendert und nur die Logik der App läuft mit JavaScript. Das klingt doch gleich viel besser als eine Webseite in ein iFrame zu packen und zu behaupten, man hätte eine App geschrieben. Eine App nativ zu entwickeln würde ich persönlich, zumindest für iOS, auf jeden Fall weiterhin vorziehen. Aus Kunden oder Firmensicht ist es natürlich ein großer Vorteil. Es werden nicht zwangsläufig Entwickler benötigt die sich mit Objective-C, Swift und/oder Java auskennen. Eine App muss nicht zweimal entwickelt werden um iOS und Android zu unterstützen. Im Idealfall könnte sogar, vorausgesetzt der Code ist modular genug, ein gewisser Bestandteil der App für eine Webversion wiederverwendet werden.
React Native geht also her, schnappt sich den Virtual-DOM und rendert daraus native View-Elemente. GENIAL!
Das Setup heute
Mein aktuellstes React Native Projekt habe ich mit Expo aufgesetzt. Es bietet aufbauend auf React Native einige zusätzliche Komponenten und Services, die man öfters brauchen kann. Dazu kommt ein super einfacher Build-Prozess, der es ohne aufwendiger Konfiguration ermöglicht, Apps (nicht nur) während der Entwicklung auf jedem beliebigen Gerät laufen zu lassen. Damit sind auch Development- und Production-Builds super leicht zu automatisieren. In der React Native Dokumentation wird man sogar schon auf den Expo Client verwiesen. Das und andere tolle Frameworks wie Mobx, haben es mir sehr leicht gemacht zwei Kollegen in die Welt von React und React Native einzuführen, ohne davor viel damit gemacht zu haben. So sind wir sehr viel schneller mit der Entwicklung vorangekommen, als ich erwartet hätte.
Zwar unterstützt React Native die Implementierung von nativen Plugins, diese müssen dann aber für iOS und Android separat entwickelt werden – und haben natürlich einen gewissen Overhead um sich als React-Native-Plugin auszugeben. Außerdem verliert man dadurch einige Bequemlichkeiten des Frameworks und ich musste leider auch einige Inkompatibilitäten mit verschiedenen Plugins feststellen. Solang man aber keine speziellen nativen Frameworks oder Services nutzen will oder muss und nicht auf absolute Top-Performance angewiesen ist, ist React Native eine tolle Methode um Hybrid-Apps ohne den “Website”-Beigeschmack zu entwickeln.
