8 Minuten Lesezeit (1599 Worte)

Die Antwort auf alle Fragen - Hybride Apps mit HTML5, CSS3 und JavaScript

News

Freitag, 20. Januar 2017

In der Ausgabe 03/2015 haben wir über das Erstellen von Cross-Platform-Apps mithilfe des Oracle Mobile Application Frameworks berichtet. Doch ist dieses Framework das Allheilmittel für alle Zwecke? In diesem Artikel möchten wir noch vor der eigentlichen Entwicklung der App ansetzen und herausfinden, welches Framework das Richtige für Deinen Anwendungsfall ist.

Was sind native, hybride und Web Apps?

„Native Apps" sind Anwendungen, die für eine spezifische Plattform entwickelt wurden. Dazu zählen zum Beispiel, die Entwicklung von Android Apps mit Java und dem Android SDK sowie das Schreiben von iOS Apps mit Objective-C oder Swift. Am Ende des Entwicklungsprozesses entsteht somit eine Installationsdatei, die anschließend durch den Apple App Store, Google Playstore und Co. verteilt werden kann.

„Web Apps" hingegen beschränken sich nicht auf eine spezielle Plattform. Es handelt sich in der Regel um eine gewöhnliche Webseite, welche für mobile Geräte optimiertwurde. Diese Website kann nun mithilfe des Browsers eines Smartphones ausgeführt werden. Die Entwicklung erfolgt häufig mit modernster Web-Technologie wie HTML5, CSS3 und JavaScript.

„Hybride Apps" stellen eine Kreuzung aus nativen und Web Apps dar (siehe Abbildung 1). Die Entwicklung wird regulär mit den genannten Web-Technologien realisiert, da die meisten Zielgeräte moderne Browser von Werk aus mitliefern. Die gängigen Frameworks für die Umsetzung von hybriden Apps, bauen anschließend Installationsdateien für die einzelnen Betriebssysteme, welche dann genau wie die nativen Apps im App Store vertrieben werden können.

Welcher Ansatz ist der richtige?

Viele Wege führen bekanntlich nach Rom. Aber welcher Ansatz eignet sich am besten für Deine Anforderungen? Häufig stellt sich der richtige App-Typ sehr schnell durch ein paar einfache Fragen heraus. Wichtig ist: Mach Dir bereits im Vorfeld Gedanken zu den geplanten Features!

Ein gravierender Unterschied zwischen den App-Typen besteht in der Performance. Während die hybride App noch einigermaßen mit der herausragenden Leistung der nativen App mithalten kann, sollte bei der Web App mit Einbußen gerechnet werden. Dies gilt allerdings nur für anspruchsvolle Anwendungen. Triviale Aufgaben kann die Web App genauso gut erledigen.

Auch in der Offline-Verfügbarkeit muss bei der Web App mit Einschränkungen gerechnet werden. Während native und hybride Apps auf den Speicher des Smartphones zugreifen, ist die Web App in der Regel auf den Browsercache angewiesen und somit sehr eingeschränkt. Durch moderne Technologien wie dem Web Storage können Daten auf dem Client gespeichert und bis zu einem gewissen Grad offline genutzt werden (siehe [1]).

Native Funktionen der Geräte können ebenfalls nur sporadisch durch Web Apps genutzt werden. Um den vollen Funktionsumfang von iPhone und Co. auszunutzen, empfiehlt sich einer der anderen Typen. Beispiele für solche Funktionen sind: Kamera, Kontaktdaten und Benachrichtigungen.

Dass das Aufrufen einer Webseite einfacher ist als die Installation einer App aus dem App Store, ist nicht zu leugnen. Auch das Anlegen eines Lesezeichens mit Symbol auf dem Homescreen erschwert den Einrichtungsvorgang nicht sonderlich. Verwendet wird diese Funktion in der Realität allerdings eher selten (siehe [2]), weshalb die Web App zwar einfacher einzurichten, aber nicht zwangsläufig die bessere Wahl ist.

Auf den ersten Blick wirkt es, als sei die Erreichbarkeit ein weiterer Vorteil von Web Apps. Da Web Apps lediglich für Smartphones optimierte Webseiten sind, können Nutzer diese per Suchmaschine finden. Native und hybride Apps hingegen sind nur im App Store erhältlich und erfordern eine gezielte Suche des Nutzers. Jedoch gibt es Anwendungsfälle, in denen der Nutzer gezielt nach Apps sucht, um das Aufrufen von Webseiten zu vermeiden; beispielsweise um anfallende Roaming-Gebühren im Ausland zu vermeiden.

Wirklich interessant wird es bei der Gegenüberstellung in Bezug auf die Entwicklungskosten. Wird die App nur für ein Betriebssystem entwickelt, so dürften sich die Kosten für alle Typen in etwa die Waage halten. Wird die Anwendung auf verschiedensten Zielgeräten (iOS, Android, etc.) ausgeführt, kann die native App nicht mehr mithalten. Es müsste dann für jede Zielplattform eine eigene native App geschrieben (und getestet!) werden. Da diesen unterschiedliche Programmiersprachen und SDKs zugrunde liegen, werden deutlich mehr Kenntnisse benötigt. Hier solltest Du darauf achten, welches Know-how in Deinem Unternehmen vorhanden ist.

Ein letzter Faktor sind die möglichen Inhalte Deiner App. Hybride und native Apps werden bei der Veröffentlichung einer mehr (Apple) oder weniger (Google) strengen Kontrolle unterzogen. So wurde beispielsweise die App „I am rich" nachträglich aus dem App Store entfernt, da sie laut Apple keinen Mehrwert für das iPhone bot [2]. Möchtest Du derartige Probleme umgehen, bietet sich hier die Web App als Mittel der Wahl an.

Da Du nun die Vor- und Nachteile der jeweiligen App-Typen kennst, liegt es an Dir, sich für einen der drei Ansätze zu entscheiden. In Abbildung 2 findest Du die genannten Kriterien noch einmal zusammengefasst. Grundsätzlich lässt sich sagen, dass die hybride App die Vorzüge der anderen beiden Varianten sehr gekonnt miteinander vereint. Solltest Du Dich nun für eine hybride App entschieden haben, darfst bzw. musst Du sich noch für eines der zahllosen Frameworks entscheiden.

Hybride Apps, die Qual der Wahl

Frameworks für hybride Apps gibt es wie Sand am Meer. Doch welches passt zu den eigenen Anforderungen? Hier erhälst Du eine Übersicht über einige der bekanntesten Ansätze und wertvolle Tipps zur Entscheidungshilfe.

Im Bereich von Enterprise Apps wird häufig das Kendo UI Framework verwendet. Die fertigen Apps können anschließend neben iOS, Android und WindowsPhone auch auf Blackberry-Geräten installiert werden. Unterstützt werden hier zusätzlich zu den Web-Technologien HTML, CSS und JavaScript auch PHP, Java, C# und zum Teil auch Ruby. Der Internetauftritt des Frameworks vermittelt den Eindruck, dass der Fokus auf der Reduzierung der Entwicklungszeit liegt. Wer die nativen Features des Smartphones nutzen möchte, wird vermutlich etwas enttäuscht sein: Das Framework bietet lediglich die Möglichkeit, auf Gesten und Multitouch zuzugreifen. Das Unternehmen Telerik, welches auf seiner Webseite mit Partnerschaften zu Microsoft und SAP wirbt, bietet sowohl ausreichend Support als auch Trainingskurse an. Der Spaß hat allerdings seinen Preis: So beginnt die günstigste Lizenz ohne Rabatt bei 999 $ pro Entwickler.

Auch Sencha Touch wird als führendes Framework im Bereich der Entwicklung von plattformübergreifenden mobilen Web Apps angepriesen. Genau wie bei Kendo UI werden hier iOS, Android, WindowsPhone und Blackberry unterstützt. Entwickelt wird ausschließlich mit HTML, CSS und JavaScript. Dafür kann man mithilfe des Frameworks neben Gesten und Multitouch auch auf den Speicher und die GPS-Informationen des Geräts zugreifen. Die Lizenzen sind mit knapp 4.500 $ für 5 Entwickler im Durchschnitt ähnlich teuer, wie bei der Konkurrenz. Selbstverständlich kann auch Sencha mit großen Kunden werben, unter denen sich beispielsweise Airbus und Amazon befinden.

Zwei der bekanntesten Frameworks für hybride Apps stellen Apache Cordova und Adobe PhoneGap dar. Nicht ohne Grund werden die beiden Namen häufig synonym verwendet. Zu Beginn gab es lediglich das PhoneGap Framework, bevor dessen Quellcode 2011 an Apache gespendet wurde. Daraus entstand das Framework Cordova. PhoneGap ist auch weiterhin als Framework auf dem Markt bekannt, basiert jedoch auf Cordova. Die beiden Frameworks unterstützen viele verschiedene Geräte, sowie einige von deren Hardware-Funktionen. Anleitungen, Bücher und mehr sind zahlreich im Internet zu finden, sodass eine Einarbeitung nicht allzu schwer fallen dürfte. Beide Frameworks werden unter der Apache Lizenz, Version 2.0 vertrieben und sind somit frei verfügbar.

Ein weiteres Framework, das auf jeden Fall genannt werden sollte, ist Ionic. Ionic ist im Vergleich zu den bereits genannten Konkurrenten eher als Newcomer anzusehen. Dennoch ist das Framework nicht zu unterschätzen. Ionic unterstützt eine Vielzahl von nativen Features, darunter Kamera- und Dateizugriff, sowie den Beschleunigungsmesser. Die Entwicklung der hybriden App findet dabei durch HTML, CSS und JavaScript statt. Anschließend wird, ähnlich wie bei PhoneGap und Apache Cordova, das Deployment genutzt. Die Nutzung des Ionic Frameworks ist völlig kostenlos. Wer mag, kann sich trotzdem für eine kostenpflichtige Enterprise-Variante entscheiden, um auf den Support zurückgreifen zu können. Einen kleinen Haken hat Ionic allerdings: Es werden zurzeit lediglich iOS und Android unterstützt. Eine Umsetzung für WindowsPhone wurde kürzlich für Ionic Version 2 angekündigt, während das Einbinden von FirefoxOS noch in Planung ist.

Man könnte die Liste der Frameworks selbstverständlich noch weiterführen, was die Auswahl allerdings nicht erleichtern würde. Daher sei gesagt, dass es ein paar Kriterien gibt, nach denen Du einige Frameworks direkt ausschließen und Dir Deine Entscheidung so erleichtern könntest. Im Jahr 2015 hatten Android und iOS ca. 95% der Marktanteile (siehe Abbildung 3), weshalb es auch nicht verwunderlich ist, dass Du diese beiden Plattformen mit den meisten Frameworks bedienen kannst. Möchtest Du zum Beispiel noch WindowsPhones unterstützen, werden Deine Wahlmöglichkeiten eingeschränkt. Auch die Entwicklungssprachen sind ein Kriterium, nach dem gut gefiltert werden kann. Denn nicht alle Frameworks basieren ausschließlich auf den Web-Technologien. Die Unterstützung der nativen Features der Smartphones eignet sich sehr gut, um die Anzahl der möglichen Frameworks zu reduzieren. Zu guter Letzt bietet sich auch das Lizenzmodell als Entscheidungskriterium an. Online findest Du unter http://mobile-frameworks-comparison-chart.com ein Tool, um die benannten Filter automatisch anzuwenden.

Ich hoffe, ich konnte Dir die Entscheidung bei der Wahl der richtigen App erleichtern. Ich freue mich, wenn Du mir von Deiner persönlichen Erfahrung berichtest.