Was ist eine Single Page Application (SPA)?
Immer häufiger werden Webanwendungen gerne als Single Page Application (kurz SPA) erstellt. Was anfänglich bei Start-Ups sehr beliebt war, ist inzwischen der Trend bei vielen Unternehmen.
Ob Facebook oder Netflix – die ganz Großen haben uns gezeigt, dass die ausschließlich auf JavaScript erstellte Oberfläche auch bei großen Anwendungen nahtlos funktioniert.
Inzwischen werden von vielen Unternehmen die Möglichkeit auf SPA’s umzusteigen, genutzt um mit ihrer Webseite die bestmögliche Effizienz zu erzielen.
Natürlich ist so eine technologische Veränderung mit entsprechenden Kosten und Risiken verbunden.
Was für den einen maßgeschneidert ist, lässt sich woanders schwer umsetzen. Deshalb ist es empfehlenswert vor einer Migration genauestens zu überprüfen ob ein tatsächlicher Nutzen durch den Umstieg entsteht oder die vorhandene Lösung die bessere ist.
Einführung
Bei SPA’s handelt es sich um Anwendungen, die nur aus einem HTML- Dokument bestehen.
Im Gegensatz zu einer klassischen Webseite, bei der der Aufbau aus mehreren, untereinander verlinkten HTML- Dokumenten vorgenommen wird, hat sie den Vorteil, dass die Inhalte in die Seite dynamisch nachgeladen werden können.
Bei einer klassischen Webseite wird bei jedem Klick eine neue Seite geladen. Die alte Seite wird im Browser von der neuen ersetzt, was natürlich entsprechend Zeit und Interaktion über den Rechner erfordert.
Bei der SPA wiederum reicht eine Seite um je nach Navigation des Nutzers die Inhalte schnell nachzuladen. Dies bedeutet weniger Datenübertragung über das Web.
Die gesamten Inhalte werden über JavaScript und XML nachgeladen.
Durch den Aufbau wie etwa mit AngularJS ist das Ersetzen der Webseiten je nach Userinteraktion nicht notwendig.
Die nur einmalige Auslieferung der CSS, JavaScript und der HTML- Struktur, machen die Single Page Apps besonders für mobile Apps interessant.
Zwischen Frontend und Backend wird die Schnittstelle der Single Page Applikation festgelegt.
Die wichtigen Informationen eine Webapp werden im Backend festgehalten und verarbeitet. Bei der Bearbeitung kommen klassische Datenbanken und Programmiersprachen wie MySQL und PHP oder etwa Java zum Einsatz.
Das Frontend sendet eine Anfrage an das Backend und daraufhin werden Daten zurückgesendet. So werden mithilfe von JavaScript Daten an die entsprechende Stelle platziert.
Vorteile
Sie bieten eine Menge an Vorteilen. Hier einige im Überblick:
- Sie bieten eine verbesserte User-Experience: Da die benötigten Daten im Client stattfinden, können auch komplexere User-Interaktionen flüssig abgebildet werden. Im Gegensatz zu herkömmlichen Webanwendungen nutzen sie weniger intensiv das Netz, da keine HTML–Seiten übertragen werden müssen. Dies vermittelt dem Benutzer das Gefühl, es handelt sich um eine native App.
- Sie sind schneller: aufgrund der verteilten Auslastung, werden die Daten nicht auf einmal geladen, sondern nach und nach aufgezeigt. Aufgrund des geringeren Aufwands bei der Interaktion mit dem Server ist die Geschwindigkeit entsprechend schneller.
- Eine höhere Reichweite ist gegeben: da die Anwendung in allen gängigen Browsern korrekt dargestellt wird, erhöht sie ebenfalls die User Experience.
- Auch Offline nutzbar: Da die App nur die wichtigsten Daten übertragen, kann man mit bereits geladenen Informationen arbeiten, auch ohne eine Internetverbindung.
- Besonders gut für sehr interaktive Seiten: da die Single Page Application nur stückchenweise die Daten hochlädt, werden Verzögerungen vermieden. Dies eignet sich besonders gut für Webseiten mit hoher Besucherinteraktion und/ oder rechenintensiven Prozessen, da sie insgesamt über eine bessere Skalierbarkeit verfügen.
Nachteile
Hier einige Nachteile im Überblick:
- Sie sind nicht so SEO- tauglich wie klassische Seiten. Aufgrund der dynamisch nachgeladenen Daten über JavaScript, ist es für Suchmaschinen zum Teil noch schwierig die Daten durchzusuchen. Zwar hat inzwischen Google eine Lösung gebracht: mit dem Einsatz von JavaScript über die Framework AngularJS können Seiten besser durchsucht werden. Dennoch sind die klassischen Webseiten derzeit noch eindeutig in Sachen SEO im Vorteil.
- Bei sehr komplexen und ausgeweiteten Webseiten, die gleichzeitig sehr formularbasiert sind, empfiehlt sich eher die klassische Struktur. Sie kann im Großen und Ganzen flexibler mit den Datenmassen umgehen.
- SPA’s setzen moderne und schnelle Browser voraus. Bei schwachen Clients und älteren Browsern fallen die Vorteile weg. Falls sie nicht von der breiten Massen, sondern zum Beispiel in einem Unternehmen genutzt werden soll, sollte im Vorfeld geklärt werden auf welchen Endgeräten sie Anwendung finden wird.
Die Anwendung für Unternehmen
Für Firmen, die eine interaktive Anwendung für ihre Kunden entwickeln wollen, ist SPA eine gute Lösung.
Die Digitalisierung hat sich in den letzten Jahren rasant weiterentwickelt. Mit ihr hat sich auch das Userverhalten im Netz rapide verändert.
Durch Facebook, Twitter & Co ist man an die schnelle Umsetzung und die benutzerfreundliche Oberfläche gewöhnt und erwartet es inzwischen auch von anderen Webseiten.
Diese neue Möglichkeit bietet für Unternehmen sich interaktiv zu präsentieren. Eine Umsattlung auf eine neue Struktur kann sich also lohnen.
Mit einer SPA können die ersten Schritte für den digitalen Erfolg erzielt werden. Besonders die Anpassungsfähigkeit und die Benutzbarkeit auf unterschiedlichsten Geräten stehen definitiv für die Anwendung.
Je nach Komplexität und den Erwartungen an die App ist der Entwicklungs- und Betriebsaufwand generell gering. Mit einer einzigen Technologie lässt sie sich von einer Datenbank bis zur Benutzeroberfläche umsetzen.
So verfügt sie mit Smartphones, PC’s oder Tablets über eine hohe Reichweite.
Für Webseiten, deren Nutzungsintensität wächst, ist sie aufgrund ihrer hohen Skalierbarkeit eindeutig im Vorteil.
Fazit
Der Übergang von einer klassischen Webanwendung zu einer Single Page Application bringt viele Vorteile mit sich.
Besonders für die User kann aufgrund der besseren Interaktionsmöglichkeit ein verbessertes User- Erlebnis ermöglicht werden.
Auch die Möglichkeit, die Webseite offline nutzen zu können, nachdem die Daten hochgeladen wurden, sprechen für sich. Dennoch sollte im Vorfeld bewertet werden, ob die Migration oder Erstellung der Anwendung einen Mehrwert birgt.
Aufgrund der zahlreichen Vorteile und dem Trend werden gerne klassische Desktop-Apps umgewandelt.
Falls bereits eine Webseite vorhanden ist, sollte der klassische Ansatz im Vorfeld beibehalten werden. Denn auch mit ihnen lassen sich moderne Web Apps entwickeln.
Ein Parallelbetrieb der alten und neuen Webanwendung zu erstellen, verringert das mögliche Risiko, welches im Vergleich zu anderen Migrationen mit dem richtigen Umgang ein definitiv zu bewältigender ist.
Derzeit ist die Suchmaschinenoptimierung bei SPA’s noch nicht so stark entwickelt wie bei klassischen Seiten. Zwar gibt es noch keine durchschlagende Lösung, aber die Anstrengungen seitens Google in Sachen AngularJS zeigen, dass früher oder später auch diese Problematik komplett behoben sein wird.
Was sind Ihre Erfahrungen?
Interessante Beiträge:
Flyacts gibt mehr Informationen zu Single Page Anwendungen
SPA auf Wikipedia
Bilder: YUHIRO.DE
Der Autor: Sascha Thattil arbeitet bei YUHIRO und hilft Unternehmern und Unternehmen beim einfachen Aufbau von Programmier-Teams in Indien. YUHIRO ist ein deutsch-indisches Unternehmen welches IT Firmen, Agenturen und IT Abteilungen Softwareentwickler bereitstellt.
Schreibe einen Kommentar