Single Page Applications – Teil 1: Einführung

20. März 2013

Die neue Bedeutung von JavaScript

Die noch junge Geschichte der Entwicklung webbasierender Anwendungssoftware ist reich an Trendwenden und Entwicklungssprüngen. Noch vor wenigen Jahren war JavaScript für viele Entwickler im Enterprise-Bereich bestenfalls ein notwendiges Übel um weitgehend statische Webseiten etwas dynamischer zu gestalten. Wenn es nach manchen von ihnen gegangen wäre, hätte diese zur Laufzeit kompilierte Sprache, deren fehlende Typsicherheit und variable Struktur nicht testbaren Spaghetti-Code geradezu heraufzubeschwören scheint, längst ihren Platz in der Mottenkiste des Internets gefunden – irgendwo zwischen ASCII-Art und blinkenden Schriften.

Dass es nicht so gekommen ist, hat eine Menge mit der Vielfalt der Geräte, mit denen heutzutage auf das Internet zugegriffen wird, zu tun. Der entscheidende Vorteil von JavaScript, wie auch von HTML und CSS, ist dessen Verfügbarkeit auf fast allen diesen Geräten. Spätestens durch den Hype um HTML5 als Web-Standard der nächsten Generation ist JavaScript zunehmend in den Mittelpunkt der Aufmerksamkeit gerückt. Die großen Browserhersteller lieferten sich zeitweise einen regelrechten Wettlauf um die schnellste JavaScript-Engine, der in einer Vervielfachung der durchschnittlichen Ausführungsgeschwindigkeit von JavaScript resultierte. Parallel dazu stieg auch das Interesse an JavaScript-Bibliotheken und komfortablen Entwicklungswerkzeugen sprunghaft an.

Single Page Applications

Im Laufe dieser Entwicklung hat sich die Lücke zwischen nativen Anwendungen und webbasierenden Anwendungen immer mehr verkleinert. Und irgendwann mittendrin ist ein neuer Anwendungstyp entstehend, für den sich mittlerweile die Bezeichnung „Single Page Application“ (oder kurz: SPA) etabliert hat. Zu den bekanntesten Single Page Applications zählen Gmail, Google Docs, Hulu und (seit einer Überarbeitung) Twitter. Da es jedoch keine eindeutige Begriffsdefinition gibt, gehen die Ansichten darüber, was eine Single Page Application eigentlich ausmacht, teilweise auseinander.

Eine Single Page Application im Sinne dieser Artikelserie weist die folgenden Charakteristika auf:

  • Wie der Name schon erahnen lässt, besteht die Single Page Application nur aus einer einzigen Webseite, deren wechselnde Inhalte von JavaScript-Code bestimmt werden. Die Kommunikation mit dem Webserver findet im Hintergrund und ohne erneutes Laden der Webseite statt. Es gibt keine Navigation zwischen verschiedenen Unterseiten, auch wenn die Single Page Application möglicherweise die URL-Zeile so verändert, dass es den Anschein hat.
  • In dieser Artikelserie soll es ausschließlich um Single Page Applications gehen, die auf einer sog. Thin Server Architecture basieren. Bei dieser Architektur wird ein Großteil der Programmlogik auf den Client verlagert, während die Hauptaufgabe des Servers im Persistieren der Daten besteht. Die Kommunikation zwischen Client und Server findet fast immer über JSON statt.
  • Der Datenaustausch zwischen Anwendung und Web-Server beschränkt sich in der Regel auf den Austausch von Informationen, wie z. B. dem Inhalt veränderter Datenentitäten. Daher müsste eigentlich nur beim ersten Laden HTML-Code vom Server auf den Client übertragen werden. In der Praxis kann das aber zu hohen anfänglichen Ladezeiten führen, sodass es durchaus üblich ist, Inhalte (nicht aber Programmlogik) zur Laufzeit nachzuladen, sofern die Art der Anwendung dies erlaubt. Bei einer offlinefähigen Anwendung für Mobilgeräte macht dies dementsprechend weniger Sinn.
  • Das JavaScript innerhalb einer Single Page Application setzt in der Regel auf überwiegend frei verfügbare Frameworks auf, die komplexe Funktionalitäten stark abstrahiert zur Verfügung stellen. Oftmals nehmen diese Frameworks dem Entwickler auch die intensive Auseinandersetzung mit den Eigenheiten der verschiedenen Browser ab. Es ist nicht unüblich, um Frameworks herum Wrapper zu schreiben, der den Zugriff auf die von der Anwendung tatsächlich benötigten Funktionen eines Frameworks weiter vereinfacht. Diese Vorgehensweise ist einer individuellen Anpassung im Code der Bibliothek in der Regel vorzuziehen, um von späteren Updates der Bibliothek profitieren zu können.
  • Single Page Applications bieten oft eine bessere User Experience als klassische Web-Anwendungen, da sie auf Benutzereingaben direkter, weil ohne ständige Umwege über den Web-Server, reagieren können. Trotzdem werden Single Page Applications immer noch im Browser ausgeführt und unterliegen den damit verbundenen Einschränkungen.

Eine allgemeinere Definition des Begriffs einschließlich einiger historischer Betrachtungen findet sich in der englischsprachigen Wikipedia.

Im nächsten Teil dieser Artikelserie werden die wichtigsten Vorteile von Single Page Applications verdeutlicht werden, auch und vor allem im Vergleich mit klassischen Web-Applikationen.