Die Nutzung von mobilen Apps wird neu definiert. Denn moderne Web-Apps verdrängen die nativen Apps vom Markt.

Native Apps gibt es schon seit mehreren Jahren. Ein Beispiel dafür sind die Wetter-Apps, die Sie im App-Store Ihrer Wahl finden. Native Apps wurden explizit für Smartphones bzw. Tablets entwickelt. Die Anwendungen sind an die Bildschirmgröße angepasst. Und an das Betriebssystem. Denn native Apps sind abhängig vom Betriebssystem. Man muss sie herunterladen und installieren.

Das Besondere an Web-Apps

Anders als native Apps entwickelt man Web-Apps nicht extra für ein Betriebssystem oder eine Bildschirmgröße.  Man muss sie auch nicht herunterladen. Web-Apps ruft man über eine URL im Browser auf. Genau wie eine Webseite. Einfach ausgedrückt: Eine Web-App ist eine Internetseite mit sehr hohem interaktiven Nutzen.

Vorteile von Web-Apps

Maximale Reichweite

Der größte und wichtigste Vorteil von Web-Apps: Sie erreichen viele Nutzer. Und das wünscht sich jeder App-Anbieter. Web-Apps werden unabhängig von Betriebssystemen entwickelt. Sie sind mit jedem modernen Browser nutzbar. Es spielt also keine Rolle, ob ein User ein Android- oder Apple-Smartphone besitzt. Mit Web-Apps erreicht man folglich eine maximale Anzahl an Nutzern.

Wichtige Voraussetzung: Auf dem Smartphone oder Tablet muss ein Browser installiert sein. Aber das ist heutzutage Standard.

Benutzerfreundlich

Die meisten Web-Apps sind responsiv. Sie passen sich perfekt an die nutzbare Bildschirmgröße an. Auch auf herkömmlichen Notebooks oder Computern können sie benutzerfreundlich bedient werden.

Geringere Kosten

Web-Apps funktionieren unabhängig vom Betriebssystem. Da sie über den Browser genutzt werden, sind sie auch unabhängig von einer Plattform. Es fallen also nur einmal Entwicklungskosten an. Das spart Zeit und Kosten.

Zum Vergleich: Native Apps werden explizit für das jeweilige Betriebssystem entwickelt. Zum Beispiel für Android oder iOS. Das bedeutet doppelte Entwicklungskosten für diese beiden mobilen Betriebssysteme.

Javascript-Frameworks

Javascript ist die moderne Programmiersprache im Web. Frameworks erleichtern Entwicklern die Arbeit. Also die Programmierung von Webseiten und Web-Apps. Ein Framework ist ein Programmiergerüst mit vordefinierten Funktionen und Bauteilen, die Entwickler einsetzen können.

React

Das Framework React wurde 2013 von Facebook entwickelt. Aktuell gibt es React in der Version 16. Heutzutage sind 271 von 10.000 Seiten mit React umgesetzt.

Viele große Konzerne setzen bei ihrer Webseite teilweise oder komplett auf das React-Framework. Dazu gehören Netflix, Airbnb, TUIfly und Facebook. Dieses sehr ausgereifte Framework hat eine große Online-Community.

Technisch betrachtet ermöglicht React, Komponenten in Javascript zu schreiben und immer wieder zu verwenden. Eine Komponente kann alles sein – von einer einzelnen Überschrift bis hin zu einem Formular, in das der Nutzer seine persönlichen Daten eingibt.

Diese Freiheit erlaubt es dem Entwickler, alle Elemente auf der Webseite als Komponenten anzulegen. Die eigentliche Webseite oder Web-App setzt er dann wie ein Puzzle aus den einzelnen Komponenten zusammen. Durch dieses Vorgehen lässt sich React in alle denkbaren anderen Systeme integrieren. New Communication integriert React z. B. in das Content-Management-System TYPO3.

Eine Webseite oder Web-App kann jedoch auch im Front-End und Back-End komplett mit React umgesetzt werden – also unabhängig von Content-Management-Systemen. Dazu müssen weitere Bibliotheken hinzugefügt werden.

Angular

Angular gibt es seit 2017 in der Version 4. Die 1. Version des von Google entwickelten Frameworks erschien bereits im Jahr 2009. Es ist das älteste der 3 Frameworks, die wir hier vorstellen. 894 von 10.000 Seiten sind mit Angular umgesetzt.  Viele Webseiten setzen seit Langem auf Angular. Zwar ist Angular nicht so leicht zu verstehen wie React es zu Beginn vielleicht sein mag. Doch große Anwendungen lassen sich mit Angular leichter skalieren. Es bietet generell mehr Möglichkeiten als React. Dank seines größeren Umfangs kann mit Angular auch eine gesamte Web-App bzw. Webseite erstellt werden.

Polymer

Das Javascript-Framework Polymer wurde 2013 von Google gegründet. Fortschritte in der Entwicklung erzielte es aber erst in den letzten 2 Jahren. 1 von 100.000 Seiten ist mit Polymer umgesetzt.

Polymer braucht wie React mehrere zusätzliche Bibliotheken, um größere Web-App-Projekte erfolgreich umzusetzen. Durch die intensive Zusammenarbeit mit den internen Entwickler-Teams von Google wurde das Framework deutlich beliebter.

YouTube hat seine Webseite komplett auf Polymer umgestellt. Das zeigt, dass Polymer zu Recht unter den 3 Big Playern in der Web-App-Entwicklung angekommen ist.

Neue Zahlen aus der Praxis

Die meisten Seiten werden aktuell also mit Angular-Frameworks umgesetzt. Doch der Trend geht in eine andere Richtung. Das verrät ein Blick auf die Stellenanzeigen von 2014 bis 2017. Gesucht werden mit Abstand mehr Programmierer mit React-Kenntnissen als mit Angular- oder Polymer-Know-how.

Progressive Web Apps

Progressive Web-Apps (PWAs) beruhen auf dem Prinzip des Progressive Enhancement. Dabei handelt es sich um ein inhaltsbasiertes Entwicklungsprinzip. PWAs ermöglichen eine Verbindungsabhängigkeit und ein Reengagement durch Push-Nachrichten.

Im Gegensatz zu herkömmlichen Web-Apps verwenden PWAs zusätzlich die Technologie des Service Workers. Der Service Worker speichert die im Vordergrund stehenden Inhalte im sogenannten Browser-Cache. Diese Daten können je nach Bedarf aus dem Cache neu geladen und aufgerufen werden. Sollte der Benutzer über keine Internetverbindung verfügen, werden ihm trotzdem Inhalte der App angezeigt und zur Verfügung gestellt. Der Benutzer wird z. B. über diese Veränderung informiert (Push-Nachrichten).  Bei der Entwicklung einer Progressive Web App entstand ein Workflow nach dem Prinzip „Offline First“. Dem liegt zugrunde, dass die Kerninhalte der App zunächst offline verfügbar gemacht werden.

Quellen:

builtwith.com

indeed.com

heise.de/Progressive-Web-Apps

Christopher Krawietz

Christopher ist Entwickler bei New Communication. Der studierte Medieninformatiker programmiert Web Apps, die gut und gerne als „crazy shit“ bezeichnet werden dürfen. Privat geht’s da deutlich bürgerlicher zu. Da findet man den eingefleischten Borussia-Dortmund-Fan nämlich entweder auf dem Fußballplatz oder im Wohnmobil. 1A-Kombi, finden wir.

Relevante Referenzen

Heiß auf Insider-Infos?

Immer up to date: Unser Newsletter versorgt dich einmal monatlich mit brandneuen Trends und Innovationen aus der Kommunikationswelt.

Newsletter bestellen