Entwicklungsumgebungen, Frameworks und Plug-ins

Die besten Toolchains für die App-Entwicklung

| Autor / Redakteur: Filipe Martins & Anna Kobylinska / Stephan Augsten

Kann man knicken: Smartphones wie das Samsung Galaxy Z Flip stellen die Fähigkeiten mobiler App-Toolchains auf die Probe.
Kann man knicken: Smartphones wie das Samsung Galaxy Z Flip stellen die Fähigkeiten mobiler App-Toolchains auf die Probe. (Bild: Samsung)

Apple Xcode und Android Studio sind nicht die einzigen IDEs zur Erstellung mobiler Apps, Swift und Java nicht die einzigen Sprachen. Mit Blick auf alternative Toolkits und Frameworks gehen wir den Geheimnissen der besten Toolchains auf die Spur.

Die Produktivität von App-Entwicklern steht und fällt mit der richtigen Toolchain. Wer sich dazu so oft wie nötig Gedanken macht und den Arbeitsablauf ganzheitlich ins Auge zu fassen vermag, stößt schon mal auf eine wahre technologische Fundgrube ungeahnter neuer Möglichkeiten. Neuland betreten ist dennoch niemals einfach.

Code once, run anywhere

Swift lieber in Xcode oder in AppCode schreiben? Alten Code in Objective C belassen oder lieber umschreiben – und falls ja, dann wie? Java in Android Studio oder doch lieber Kotlin statt Java? Oder vielleicht kein Swift, sondern stattdessen C# in Xamarin? Wie wäre es denn mit React Native? Es sind solche Fragen, die sich einem Entwickler(team) in der Praxis stellen.

Auf der Android-Plattform vertrauen die meisten Coder auf Android Studio, im Apple-Ökosystem spielt Xcode die erste Geige. Es gibt zwar reichlich Alternativen, von JetBrains AppCode, React Native bis hin zu Microsoft Visual Studio mit Xamarin, die eierlegende Wollmilchsau lässt bisher aber noch auf sich warten.

App-Entwickler müssen sich vielmehr mit einem Flickenteppich aus verschiedenen Lösungen zufriedengeben – und diesen am besten auch gleich selbst stricken. Für jede Zielplattform eine eigene Codebasis zu pflegen. ist wahrlich nicht der Weisheit letzter Schluss.

Zwei Drittel der Mobile-App-Entwickler nutzen dennoch native Tools, fand JetBrains vergangenes Jahr in einer Umfrage heraus. Jeder zweite Developer setzt (auch) plattformübergreifende Technologien ein. Die Liste plattformübergreifender mobiler Frameworks führt React Native an (42 Prozent), gefolgt von Flutter (30 Prozent), Cordova (29 Prozent), Ionic (28 Prozent) und Xamarin (26 Prozent).

Der Gedanke, „Code once, run (natively) anywhere“, gewinnt offenbar an Popularität. React Native hat sich einem anderen Motto verschrieben: „Learn once, write anywhere“. Im Endeffekt läuft es aber genau auf Dasselbe hinaus.

React Native: Learn once, write anywhere

Mit React Native können Entwickler native Apps für iOS und Android OS mit JavaScript und React coden. Bei React handelt es sich um eine leistungsstarke Java-Bibliothek für das „schmerzlose“ Erstellen grafischer Benutzerschnittstellen, die von Facebook und einer Gemeinde Freiwilliger gepflegt und weiterentwickelt wird. React-Primitive werden als native Plattform-UIs umgesetzt. React ist deklarativ, leicht zu debuggen, komponentenbasiert und erweiterungsfähig. Serverseitiges Rendering ist mit Node.js möglich.

Auch React Native baut deklarative UIs in JavaScript und kompiliert sich zu nativem Code der Zielplattform, im Gegensatz zu Frameworks wie Apache Cordova/PhoneGap (welche das HTML-Markup, CSS und den JavaScript-Code bloß in einen nativen Wrapper verpacken, aber nahezu unverändert belassen).

React Native erzeugt hierzu einen Hierarchiebaum von UI-Elementen (in React-Lingo ein „virtuelles DOM“). Während die Ausgabe von ReactJS einen Webbrowser adressiert, übersetzt React Native die virtuelle DOM-Hierarchie in native mobile Views mit nativen Bindings der betreffenden Plattform, welche mit der Anwendungslogik in JavaScript kommunizieren.

React Native (kurz: RN) ist aus einem Facebook-Hackathon hervorgegangen. Es hat Facebook erlaubt, die Entwicklungszeit seiner mobilen Apps auf die Hälfte zu reduzieren. Als erste Anwendung brachte Facebook die mobile App Ads heraus. Hier konnte das Framework mit der leichten Handhabung verschiedener Display-Formgrößen trumpfen

Seither konnte React Native andere noble Anwender für sich gewinnen. Das GitHub-Repo für das RN-Plug-In für die Universal Windows Platform nahm beispielsweise Microsoft ganz offiziell unter seine Fittiche und entwickelt es aktiv weiter, sowohl mit Blick auf mobile Apps als auch auf Desktop-Apps. Die Entwicklergemeinde umfasst inzwischen viele noble Namen wie beispielsweise Shopify. React Native kann Apps mittlerweile sogar für macOS und Apple tvOS ausgeben.

React Native bei Walmart

„React Native ist schnell, wirklich schnell“. kommentiert Keertimaan Tenneti, Senior Engineering Manager bei Walmart Global eCommerce, dem Online-Ableger des globalen Einzelhandels. Zwar habe sein Team keinerlei direkten Vergleich mit einer nativen Variante ihrer App anstellen können. Er sei jedoch davon überzeugt, dass die Entwicklung der App in nativen Sprachen gegenüber dem Umweg via React Native kaum nennenswerte Vorteile gebracht hätte.

Durch den Einsatz von RN sei 95 Prozent der Codebasis den beiden mobilen Plattformen iOS und Android OS gemeinsam; das Know-how der Entwickler könne besser zur Geltung kommen. Die Performance beider Apps sei nahezu identisch mit nativer Performance und die UI-Animationen seien „extrem flüssig“.

RN-Experiment bei Airbnb gescheitert

Auch Airbnb, der Marktplatz für Unterkünfte, hat zeitweise mit React Native experimentiert. Es ging jedoch auf und ab. Nach der reibungslosen Einrichtung der Toolchain rund um React Native konnte das Team die ersten Schritte mit dem Komplexitätsgrad von „Hello World“ mit fliegenden Fahnen absolvieren und stürzte sich dann gleich aufs Eingemachte.

Kurz danach war die Hölle los, berichtet ein Insider. Mit React-typischen Konzepten rund um das Status-Management im Kontext einer React-App konnten sich die Entwickler eine Zeitlang nicht so richtig anfreunden. Erst die Wiederverwendbarkeit des Codes hat React Native einen festen Platz in der Toolchain beschert.

Das Refactoring wurde damit zum Kindespiel. Auch iterative Verbesserungen gingen plötzlich viel leichter von der Hand. Wer ins Hintertreffen geraten war, konnte schnell aufholen. Dennoch hat Airbnb in der Zwischenzeit React Native verworfen. Die Integration mit bestehender nativer Codebasis erwies sich als zu aufwändig.

React Native bei Shopify

Shopify hatte mit React Native wesentlich mehr Erfolg. Bei Arrive (zuvor nur für iOS verfügbar) konnte das Entwicklerteam die Produktivität verdoppeln; am Point of Sale ließen sich die minimalen Systemvoraussetzungen von 2GHz auf 1,5 GHz reduzieren und somit eine größere Zielgruppe adressieren. Im Falle von Compass konnte das Entwicklerteam die gemeinsame Codebasis der beiden Editionen der App (für Android OS und iOS) auf rekordverdächtigte 99 Prozent ausbauen.

Shopify möchte fortan alle neuen Apps in absehbarer Zeit nur noch in React Native umsetzen. Durch die Akquisition des sozialen Netzwerks Tictail ist das Unternehmen über React Native gestolpert und hat das Framework in die eigene Toolchain aufgenommen. Die Spotify-Apps Arrive, Point of Sale und Compass für Android und iOS sind bereits in React Native entstanden.

Im Bestreben, das Debuggen von Apps in React Native zu beschleunigen, musste sich das Team von Shopify einige Workflow-Verbesserungen einfallen lassen. So entstand unter anderem ein Update-Tool für Apps mit Unterstützung für Git-Repositories. Damit die beteiligten Entwickler auf Pull-Requests von Work-in-Progress-Code möglichst verzögerungsfrei reagieren können, wird mit dem betreffenden Git-Commit ein QR-Code in einem Github-Kommentar veröffentlicht.

Scannt ein Shopify-Entwickler den QR-Code aus dem automatisch erstellten GitHub-Kommentar per Smartphone ein, aktualisiert sich das JavaScript-Bundle in der zu testenden App auf seinem Testgerät und schon läuft darauf der neueste Code aus dem betreffenden Pull-Request. So wird es auch getestet, lange bevor es den Weg zu TestFlight findet.

Die Shopify-interne Lösung hat den Gedanken bei Expo entliehen, einer quelloffenen Bibliothek zur Entwicklung universeller nativer Apps in JavaScript und React Native. Shopify möchte das eigene Tool voraussichtlich noch quelloffen zur Verfügung stellen.

App-zentrisch statt Device-zentrisch: Ambient Computing

In der IT-Welt, wo die Endbenutzer zwischen Geräten verschiedener Anbieter kontinuierlich hin und her wechseln, müssen Entwickler mit ihren mobilen Apps möglichst viele davon abdecken, um die Nutzer nicht zu verlieren – ob Smartphones, Watches oder sonstige Wearables, Tablets, Desktops, Laptops, Smart TVs oder andere Smart Displays, eine App-Schmiede möchte sich eine relevante Plattform niemals entgehen lassen.

Im Zeichen von Ambient Computing: Die Vielfalt von Displays ruft Frameworks wie Flutter auf den Plan.
Im Zeichen von Ambient Computing: Die Vielfalt von Displays ruft Frameworks wie Flutter auf den Plan. (Bild: Samsung)

Mit Flutter, einem UI-Toolkit möchte Google mobilen Entwicklern unter die Arme greifen und dabei helfen, die kaum noch überschaubare Vielfalt von Displays und Gerätetypen plattformübergreifend in den Griff zu bekommen. Ziel ist ein Paradigmenwechsel von Device-zentrischer App-Entwicklung zu der Vision des Ambient Computing: einer schwarmartigen Laufzeitumgebung.

Flutter kann Apps unter anderem für iOS und Android aus einer einzigen Codebasis heraus ausgeben. Das Framework nutzt hierzu eine eigene objektorientierte Programmiersprache namens Dart. Sie ähnelt JavaScript und macht einige Anleihen bei Java. Flutter zielt nicht bloß darauf ab, native Apps für iOS und Android OS auszugeben. Es erlaubt es vielmehr, den Anwendungscode Device-agnostisch auf jedem Endgerät auszuführen.

Die Frage, welches Endgerät gerade adressiert werden soll, rückt damit in den Hintergrund. Anstatt sich geistig mit der Cross-Plattform-Akrobatik zu befassen, sollen sich Entwickler darauf konzentrieren können, die bestmögliche Ausführungslogik zu schreiben.

Zur Verwirklichung der Vision eines Multi-Device- und Multi-Plattform-Schwarms von Endgeräten mit ihren Apps möchte Google mit Flutter ein Entwicklungs-Framework und eine -Toolbox geschaffen haben, welche mit einer „kompromisslosen“ Entwickler- und Benutzererfahrung trumpfen kann – was auch immer das bedeuten mag. Googles Motto lautet: „Fast development and stateful, hot reload“. Perfekt für ein Geschäftsmodell, in dem kanalübergreifende Attribution (Stichwort: „Omnichannel“) die Kasse klingeln lässt.

Was Google über die eigenen Tools denkt, sei dahingestellt. Was die Entwickler dazu meinen ist viel interessanter. In GitHubs Umfrage „State of the Octoverse“ (2019) konnte Flutter in der Kategorie der beliebtesten quelloffenen Projekte den dritten Platz einheimsen. Gemessen an der Zahl der Projektteilnehmer kommt es in der Kategorie der am schnellsten wachsenden Open Source-Initiativen auf Platz zwei.

Vom Sprachsalat zum Flickenteppich

Wer Apple-Geräte adressieren will, muss früher oder später Apples Xcode starten. Das setzt zwingend einen Mac voraus. Inzwischen ist die Zukunft von Objective C besiegelt. Bei der bevorstehenden Umstellung von Intel auf ARM dürfte Apple den Support für Objective C komplett aufgeben. Den betroffenen App-Entwicklern steht eine Zwangsmigration zu Swift bevor.

Apples Xcode glänzt durch die enge und recht gelungene Integration mit Apples Technologien und die zeitnahe Kopplung an Apples Produktzyklen. Da sich aber mobile Apps nicht auf die Apple-Welt beschränken, müssen sich Android-Entwickler woanders nach Lösungen umschauen. Wer sich auf dem PC zuhause fühlt und mit C# anfreunden kann, könnte mit Xamarin Studio zumindest die Mehrheit seiner Arbeit unter Windows erledigen. Rein theoretisch, versteht sich.

Microsofts Visual Studio mit dem quelloffenen Xamarin-Framework kann außer Apples iOS auch noch Googles Android OS adressieren. Die C#-Schnittstelle für iOS und Android macht es möglich. Der Gedanke dahinter: Multiplattform-Apps mit einer einzigen .NET-Codebasis (zu etwa drei Viertel), einer gemeinsamen Sprache (C#), einer einheitlichen API und einer einzigen Sammlung von Datenstrukturen erstellen. Auf dem Papier sieht es gut aus.

Geteilte Freude ist doppelte Freude: Architektur einer Xamarin-App für Android OS und iOS.
Geteilte Freude ist doppelte Freude: Architektur einer Xamarin-App für Android OS und iOS. (Bild: Microsoft)

Aber Papier ist geduldig. Xamarin, die schon legendäre Grube hoffnungslos angestaubter Bugs, gilt allgemein als das Gegenteil von „produktionsreif“. In der Praxis machen die endlosen Debugging-Runden und die vielen umständlichen Workarounds den vermeintlichen Zeitvorsprung einer plattformübergreifenden Codebasis schnell wieder zunichte. Die Entwicklererfahrung ist Frust.

Auch JetBrains möchte mit AppCode plattformübergreifende Entwicklerproduktivität fördern. Diese IDE basiert, genauso wie ihre Schwester Android Studio, auf dem Unterbau von IntelliJ IDEA. Dank der konzeptionellen Parallelen findet AppCode bei Android-Entwicklern recht großen Zuspruch. AppCode ist zudem vollständig interoperabel mit Xcode (ohne zusätzliche Konfigurationsschritte). Letzteres ist insofern relevant, als AppCode u.a. zur Gestaltung des GUI auf Xcode zurückgreift. Als ausgereift kann man den Workflow dennoch kaum bezeichnen.

Tipp: Mit ReSharper bietet JetBrains eine leistungsstarke Visual Studio-Erweiterung für .NET-Entwickler mit Produktivitätsfeatures wie der Code-Analyse und dem -Refactoring. Für JavaScript hat JetBrains eine (kostenpflichtige) IDE namens WebStorm im Köcher. Sie unterstützt JavaScript und TypeScript und all die beliebtesten Frameworks, von React/React Native, über Ionic, Cordova, Electron, Node.js, Meteor, Angular bis hin zu Vue.js, das volle Spektrum also.

Fazit

In der mobilen App-Entwicklung steht und fällt die Produktivität mit der richtigen Toolchain. App-Entwickler kommen nach wie vor nicht umhin, sich diese in Eigenregie zu stricken.

Kommentare werden geladen....

Kommentar zu diesem Artikel

Der Kommentar wird durch einen Redakteur geprüft und in Kürze freigeschaltet.

Anonym mitdiskutieren oder einloggen Anmelden

Avatar
Zur Wahrung unserer Interessen speichern wir zusätzlich zu den o.g. Informationen die IP-Adresse. Dies dient ausschließlich dem Zweck, dass Sie als Urheber des Kommentars identifiziert werden können. Rechtliche Grundlage ist die Wahrung berechtigter Interessen gem. Art 6 Abs 1 lit. f) DSGVO.
  1. Avatar
    Avatar
    Bearbeitet von am
    Bearbeitet von am
    1. Avatar
      Avatar
      Bearbeitet von am
      Bearbeitet von am

Kommentare werden geladen....

Kommentar melden

Melden Sie diesen Kommentar, wenn dieser nicht den Richtlinien entspricht.

Kommentar Freigeben

Der untenstehende Text wird an den Kommentator gesendet, falls dieser eine Email-hinterlegt hat.

Freigabe entfernen

Der untenstehende Text wird an den Kommentator gesendet, falls dieser eine Email-hinterlegt hat.

copyright

Dieser Beitrag ist urheberrechtlich geschützt. Sie wollen ihn für Ihre Zwecke verwenden? Kontaktieren Sie uns über: support.vogel.de/ (ID: 46481934 / Native Apps)