© saicle/Shutterstock.com
Softwarearchitektur in JavaScript

Solide auf drei Pfeilern


Die Architektur einer Software beschreibt den Aufbau und das Zusammenspiel der einzelnen Komponenten des Systems. Sobald Sie vorhaben, eine Anwendung zu erstellen, die mehr als eine Handvoll Zeilen JavaScript-Quellcode umfassen soll, sollten Sie sich Gedanken über die Architektur dieser Anwendung machen. Wie eine solche Architektur aussehen kann und worauf Sie bei der Planung achten sollten, erfahren Sie in diesem Artikel.

Die ernüchternde Nachricht kommt zuerst: Es gibt nicht die eine perfekte Vorgehensweise, wenn es um den Aufbau von Anwendungen in JavaScript geht. Die Wahl der Mittel und damit der Architektur hängt vielmehr von zahlreichen Faktoren ab. Diese fallen häufig in den Bereich der nicht funktionalen Anforderungen einer Applikation. Klassische Beispiele sind hier Antwortzeiten, Skalierbarkeit oder Zuverlässigkeit. Je nachdem, was Ihre Applikation leisten soll, werden diese nicht funktionalen Anforderungen unterschiedlich gewichtet und müssen bei der Planung der Architektur und der Auswahl der Hilfsmittel berücksichtigt werden.

Architektur in der realen Welt

Wie aber funktioniert die Auswahl der Architektur für eine Applikation in den meisten Fällen? Hier gibt es die verschiedensten Varianten. Häufig kennen ein oder mehrere Entwickler eine bestimmte Architekturform und wenden diese auf das zu lösende Problem an. Diese Vorgehensweise hat jedoch den Nachteil, dass die gewählte Architektur nicht aufgrund des Problems, sondern wegen persönlicher Präferenzen gewählt wurde.

Eine weitere, nicht unproblematische Form der Architekturauswahl besteht darin, zunächst sehr klein und wenig strukturiert mit der Entwicklung einer Applikation zu beginnen. Mit zunehmendem Wachstum der Applikation wird der Quellcode jedoch nicht umstrukturiert, sondern lediglich erweitert und auf der wenig stabilen Basis aufgesetzt. Dadurch werden technische Schulden aufgebaut, die Sie früher oder später in Form von Refactorings zurückzahlen müssen, oder die Entwicklung Ihrer Applikation wird so teuer, dass es sich nicht mehr lohnt, sie weiter zu betreiben.

Die dritte und beste Variante besteht darin, die passende Architekturform für das gegebene Problem zu finden und zu implementieren. Dabei sollten Sie Ihre Architekturentscheidung kontinuierlich hinterfragen und, wann immer notwendig, Korrekturen und Änderungen vornehmen. Das Finden der richtigen Softwarearchitektur ist also keine einmalige Aktion zu Beginn eines Projekts, sondern vielmehr ein laufender Prozess, der sich über die gesamte Lebenszeit einer Applikation erstreckt. Nehmen Sie laufend kleinere Änderungen an Ihrer Applikation vor und modernisieren Sie Ihre Applikation so stetig. Verlängern Sie einerseits die Lebenserwartung Ihrer Applikation und vermeiden andererseits eine veraltete und nicht mehr wartbare Architektur.

Nicht funktionale Anforderungen an eine Webapplikation

Die perfekte Architektur für eine Webapplikation schon zu Beginn eines Projekts zu finden, ist eine Illusion. Es gelingt Ihnen maximal eine grobe Näherung an die perfekte Lösung. Entscheidend für eine gute Lösung sind die Rahmenbedingungen, die für die Applikation gesetzt werden. Wie bei der Sammlung von funktionalen Anforderungen werden Sie auch bei der Aufnahme der nicht funktionalen Anforderungen nicht alleine gelassen. Es existieren einige Frameworks und Dokumente, die Ihnen hier Hilfestellung leisten können. Ein guter Ansatzpunkt, um Anforderungen an Ihre Architektur zu finden, ist, dass Ihre Software eine gute Qualität aufweisen muss. Softwarequalität ist laut DIN durch die folgenden Rahmenparameter definiert:

  • Funktionalität

  • Zuverlässigkeit

  • Benutzbarkeit

  • Effizienz

  • Wartbarkeit

  • Übertragbarkeit

Was bedeutet das aber jetzt für Ihre JavaScript-Applikation? Zunächst müssen Sie bewerten, was Ihre Applikation leisten soll und wie viel Ihnen das wert ist. Je mehr nicht funktionale Anforderungen Sie an Ihre Applikation stellen, desto umfangreicher und damit teurer wird Ihre Implementierung. Das bedeutet, dass Sie, vor allem wenn Sie nicht über ein unerschöpfliches Budget verfügen, priorisieren sollten, worauf Sie Wert legen. Eine konkrete Situation könnte sein, dass Ihnen nur begrenzte Serverressourcen für Ihre Applikation zur Verfügung stehen und Sie aus diesem Grund großen Wert auf die Effizienz Ihrer Applikation legen müssen. Oder dass Ihre Applikation besonders darauf ausgelegt sein soll, dass Erweiterungen und zusätzliche Features in Zukunft möglichst günstig umzusetzen sind.

Alle diese Parameter beeinflussen, welche Struktur, Komponenten, Bibliotheken und Frameworks bei der Entwicklung Ihrer Applikation zum Einsatz kommen.

Grundsätzliche Arten von Webapplikationen

Zunächst sollten Sie sich die grundsätzliche Frage stellen: Wie soll Ihre Applikation aufgebaut sein? Unterteilen Sie Ihre Applikation in mehrere voneinander getrennte Seiten, oder besteht Ihre Applikation aus nur einer Seite, die für die Anzeige aller Informationen verantwortlich ist?

Außerdem sollten Sie abschätzen, wie oft sich die Informationen innerhalb Ihrer Applikation ändern. Visualisieren Sie beispielsweise innerhalb Ihrer Applikation Echtzeitdaten, wie die Leistungsdaten eines Servers oder Börsenkurse, müssen Sie dafür sorgen, dass Sie regelmäßig aktualisierte Daten vom Server erhalten.

Die Entscheidung zwischen jeweils Multi-Page-Webapplikationen MPA, Single-Page-Webapplikationen (SPA) und Echtzeitwebapplikationen bedeutet für Sie zunächst die erste Weichenstellung. Die Art der Applikation entscheidet zunächst generell über die Menge an JavaScript, die Sie in Ihrer Applikation benötigen. Bei einer MPA setzen Sie normalerweise weniger JavaScript ein als bei einer SPA. Die Informationen, die Sie in einer MPA darstellen, befinden sich im Normalfall auf der Seite, die vom Server geladen wird. JavaScript spielt hier nur eine untergeordnete Rolle und dient lediglich zur Erweiterung der Funktionalität. Im Gegensatz dazu müssen Sie bei einer SPA die Daten vom Server holen, die Sie für die aktuell gewählte Komponente darstellen möchten. Diese Logik müssen Sie in JavaScript abbilden. Ein Vorteil der SPA gegenüber der MPA ist, dass Sie die Daten der Bibliotheken und Frameworks, die Sie für Ihre Applikation benötigen, lediglich einmal, nämlich beim Aufruf der Applikation im Browser, laden müssen. Im weiteren Verlauf laden Sie lediglich Informationen oder Teile der Applikation nach. Bei einer MPA wird bei jedem Seitenwechsel die gesamte Seite, also das gesamte benötigte HTML, CSS und JavaScript, geladen. Die Single Page fühlt sich also für den Benutzer nach einem längeren initialen Start responsiver an.

Trotz ihrer Nachteile haben MPAs ihre Daseinsberechtigung. In Umgebungen, in denen JavaScript nur für die Unterstützung von Benutzern verwend...

Neugierig geworden?

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