LimeSoda Blog ☰ Zeige Kategorien

Web-, Hybrid- und Native-Apps

Es gibt mittlerweile viele Möglichkeiten eine App für Smartphones und Tablets zu erstellen, in diesem Beitrag möchte ich die Unterschiede und Eigenheiten erklären. Ich hoffe es wird nicht zu technisch, Fragen per Kommentar beantworte ich gerne :)

Prinzipiell gibt es 3 App-Formen, die einfachste ist eigentlich keine „richtige“ mobile App:

Web-Apps

Eine Web-App ist in der Regel eine SPA (Single Page App, zb erstellt mit AngularJS, React oder anderen Frameworks). Diese hat unmittelbar nichts mit mobilen Geräten zu tun und ist eigentlich „nur“ eine Website. Allerdings gibt es die Möglichkeit diese per App Cache offline verfügbar zu machen und im fullscreen-Modus laufen zu lassen. Setzt man dann am mobilen Gerät eine Verknüpfung zur Website auf den Home Screen, so verhält sich die App fast „native“. Sehr einfach passiert das über die folgenden Metadaten im head-Bereich:

Für iOS können auch gleich Name der Verknüpfung und Icons festgelegt werden – und zwar im Optimalfall für verschiedene Screens. Einen guten Überblick hierfür bietet der Safari Web Content Guide von Apple.

Für den Chrome kann eine manifest.json-Datei für zusätzliche Einstellungen angelegt werden. Auch die device orientation kann fixiert werden, ein eigenes Icon ist ebenfalls möglich. Ein Beispiel:

Als Verknüpfung am Desktop abgelegt ist die Web-App somit kaum von einer nativen App zu unterscheiden. Nähere Infos gibt es im Chrome Developer Guide.

Vorteile von Web-Apps

  • Keine Installation notwendig, natürlich auch kein App Update
  • Kein Mac zur Entwicklung notwendig, keine Wartezeit bei Apple
  • Plattformunabhängig
  • Keine komplexen Kompilierungs-Prozesse

Nachteile von Web-Apps

  • Kein Zugriff auf alle Hardware-Komponenten (je nach Browser)
  • Langsamer als Native-Apps
  • Geringere „Verbundenheit“ zum User, da nicht installiert

Hybrid-Apps

In den letzten Jahren wurden Hybrid-Apps immer interessanter, vor allem durch die zahlreichen und mittlerweile ausgereiften Frameworks. Eine Hybrid-App wird in der Regel per JavaScript programmiert und ist grundsätzlich ebenfalls eine normale SPA. Allerdings wird die App nach der Programmierung in eine installierbare native App umgewandelt. Dazu nutzt man zum Beispiel Apache Cordova um die SPA in einen WebView Container zu packen. Eigentlich läuft eine Hybrid App also in einem Mini-Browser in der installierten nativen App und ist damit auch leider etwas langsamer als eine native App. Zur Web-App gibt es zwei wesentliche Unterschiede: Hybrid-Apps werden installiert und können in vollem Umfang auf die Hardware der mobilen Geräte zugreifen – sofern es dafür ein Plugin gibt, und das ist bei Cordova in der Regel kein Problem.

Der Entwicklungsprozess ist ähnlich wie bei einer Web-App:

  • Erstellung des Grundgerüsts mit Cordova
  • Programmierung als SPA (natürlich kann auch eine vorhandene SPA in ein Cordova Projekt umgewandelt werden)
  • Kompilierung in native App per Cordova – separate Kompilierung für Android und iOS

Mit nur einer Codebasis erstellt man also Apps für jede Plattform, einen Haken hat das Ganze allerdings: Um eine iOS App per Cordova zu erstellen braucht man einen Mac. Ausserdem ist zur Bereitstellung im Google Play Store eine einmalige Gebühr fällig, sowie eine jährliche Gebühr für den Apple Store.

Frameworks für eine leichtere Entwicklung gibt es wie erwähnt jede Menge, hier die bekanntesten:

Vorteile von Hybrid-Apps

  • Eine Codebasis für alle Plattformen
  • Schnelle Entwicklung, leichte Wartung
  • Testen ohne Kompilierung/Emulation
  • Ausgereifte Frameworks
  • Zugriff auf Hardware/Permissions/Speicher

Nachteile von Hybrid-Apps

  • Langsamer als Native-App
  • Apps sehen auf iOS und Android gleich aus – keine nativen Komponenten. Ein Hybrid-App erkennt man recht einfach am Date Picker, der unter Android und iOS gleich aussieht ;)

Native-App

Das Non­plus­ul­t­ra ist natürlich eine native App, programmiert in der hauseigenen Sprache der jeweiligen Plattform. Das wäre bei Android die bekannte Programmiersprache Java, bei iOS entweder Objective-C oder Swift. Man braucht also pro Plattform eine separate Programmierung und in der Regel ist die Programmierung komplexer als per JavaScript. Dafür wird man mit besserer Performance belohnt und es können native Komponenten verwendet werden. Die Apps passen also in der Regel besser zum System.

Vorteile von Native-Apps

  • Sieht am Besten aus (native Komponenten)
  • Performance unschlagbar

Nachteile von Native-Apps

  • Separate Programmierung für Android/iOS
  • Komplexeres Testing/Debugging
  • Längere Entwicklungszeit (auch pro Plattform)

Wann ist welche App-Form sinnvoll?

In vielen Fällen wird man mit einer Web-App auskommen, eine Hybrid-App sorgt durch die Installation für mehr Verbundenheit zum User (schliesslich ist die Web-App grundsätzlich nichts anderes als ein Desktop-Link). Wichtigster Entscheidungspunkt ist allerdings der Zugriff auf die Hardware und diverse Benutzerdaten. Brauche ich zum Beispiel Zugriff auf die Kontaktdatenbank des Smartphones oder will ich die Kamera in meiner App nutzen (plattformübergreifend und ohne getUserMedia), dann ist eine Hybrid-App notwendig.

Eine Native-App ist in der Regel nur sinnvoll wenn Performance eine wichtige Rolle spielt, vor allem also für komplexere Spiele.

App-Generatoren

Als Alternative existieren eine Reihe von Generatoren die eine vorhandene Website in eine App umwandeln. Das funktioniert relativ gut, man ist damit allerdings nicht besonders flexibel. Zwei Beispiele dafür:

Ich würde stattdessen aber eher zu einer Web- oder Hybrid-App raten, die Website selbst muss ja ohnehin programmiert werden.

Hinterlasse einen Fingerabdruck für die Ewigkeit: Ein Kommentar bei LimeSoda!

(*) Pflichtfeld

Bewirb dich bei uns!

LimeSoda.
Digitalagentur in Wien.

Bewirb dich jetzt!
Andreas Teufel

Verpasse nicht den nächsten Blog-Post von Andreas!

Jetzt zum LimeSoda-Newsletter anmelden