© Excellent backgrounds/Shutterstock.com
Kolumne: EnterpriseTales

Kolumne: EnterpriseTales


Zugegebenermaßen kann der Einstieg in die Single-Page-Welt verwirrend sein. Noch vor der ersten Zeile Code müssen verschiedene Tools installiert und unzählige Eingaben in der Kommandozeile getätigt werden. Zwar bieten viele Single-Page-Frameworks mittlerweile Werkzeuge (CLI-Tools [1], [2]), mit deren Hilfe sich Projekte größtenteils automatisiert erstellen und konfigurieren lassen. Trotzdem bleibt bei Neulingen oft ein fader Beigeschmack: Braucht man das wirklich alles? Früher musste man doch nur jQuery herunterladen …

Rein technisch gesehen zeichnet sich eine Single-Page Application (SPA) heute vor allem dadurch aus, dass das HTML der Benutzeroberfläche erst im Browser mithilfe von JavaScript erzeugt wird (clientseitiges Rendering). Dadurch kann ein Großteil der UI-Logik, inklusive des Renderingprozesses, vom Server in den Client verlagert werden. Eine SPA fühlt sich für Benutzer während des Betriebs deshalb häufig flüssiger an als serverseitig gerenderte Webanwendungen. Listing 1 zeigt die Umsetzung einer zugegebenermaßen sehr rudimentären SPA. Um den Code zu vereinfachen, wird hier jQuery [3] verwendet. Die Abfrage von JSON-Daten findet über eine HTTP-basierte Schnittstelle statt. Die Daten werden in der renderApp-Methode in HTML-Fragmente übersetzt, also clientseitig gerendert. Unter der Haube machen das, zumindest in Ansätzen, auch die aktuellen SPA-Librarys und -Frameworks so. Dort kommen jedoch ausgefeilte und performante Konzepte wie Virtual-DOM-Strukturen und Templating Engines zum Einsatz.

Listing 1: Clientseitiges Rendering

class TwitterApp { async init() { this.tweets = await $.get('http://twitter.com/tweets'); this.renderApp(); } renderApp() { const items = this.tweets.map(tweet => $(`<li>${tweet}</li>`)); $(document.body).append($('<ul/>').append(items)); } } new TwitterApp().init();

Zugrunde liegt Node.js

Die Basis für die moderne Webentwicklung bildet Node. js. Die Plattform ist dadurch bekannt geworden, dass sie in immer mehr großen Unternehmen für die Umsetzung leichtgewichtiger und skalierbarer Server verwendet wird. Dabei ist Node.js aber in erster Linie kein Serverframework, sondern eine JavaScript Runtime. Damit lässt sich JavaScript lokal und ohne die Benutzung eines Browsers ausführen. Auch der Zugriff auf das Dateisystem oder das Erstellen von HTTP(S)-Servern ist möglich. Das ist bei der Entwicklung einer SPA hilfreich, weil sich beispielsweise das Ausführen von Tests, statische Codeanalysen oder andere Build-Schritte über die Ko...

Exklusives Abo-Special

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang