Technische Highlights: Single Page Application, Progressive Web App und GraphQL
Mit dem Ziel die Benutzererfahrung insbesondere bei mobilen Endgeräten und unzuverlässiger Internetverbindung zu verbessern, entschieden wir uns für die Realisierung des Frontends als Single Page Application (SPA) auf Basis des JavaScript Frameworks React. React wurde von Facebook entwickelt und gehört aktuell zu den gefragtesten Lösungen zum Erstellen von modernen Webanwendungen. Das Backend, welches letztendlich die Daten sowie die Anwendungslogik beinhaltet, haben wir auf Basis von Ruby on Rails entwickelt. Die Kommunikation zwischen Frontend und Backend erfolgt über eine GraphQL-Schnittstelle. Die Frontend-Anwendung verfügt außerdem über Eigenschaften einer Progressive Web App (PWA), damit sie auch bei Netzverlust funktioniert.
Der Unterschied einer Single Page Application zu einer klassischen Webanwendung liegt hauptsächlich in der geänderten Rolle des Servers. Während der Server in einer klassischen Webanwendung die Auslieferung aller zugehörigen Ressourcen (z.B. alle HTML-Files sowie Assets) übernimmt, muss er bei einer SPA nur eine einzige Ressource (z.B. ein Gesamt-HTML-File) zur Verfügung stellen. Navigiert der Nutzer über eine solche Website, reagiert die Webanwendung nur, indem sie die Änderungen beim Server abfragt, ohne die Seite komplett neu laden zu müssen. Der Server stellt die benötigten Daten über eine API zur Verfügung. Und genau hier liegt der Vorteil, den wir uns in diesem Projekt zunutze machen konnten. Die Kommunikation wird vereinfacht, da nicht jedes Mal die gesamte Seite berechnet und ausgeliefert werden muss. Die Anfragen können dadurch effizienter und schneller beantwortet werden.
Ein weiterer positiver Effekt entsteht durch die Offline-Speichern Funktionalität der Progressive Web App (PWA). PWAs cachen und speichern Inhalte im Browser, die dann nicht immer wieder neu geladen werden müssen und auch offline zur Verfügung stehen. Das Offline-Speichern funktioniert mit Unterstützung der neuen Browsertechnologie Service-Worker, die von immer mehr Browsern, darunter Firefox und Chrome, unterstützt wird. Der Service-Worker erlaubt es, Daten im Hintergrund zu laden – auch nach dem Verlassen einer Website. Dadurch können Websites immer dann aktualisiert werden, wenn Internet zur Verfügung steht. Die Nutzer unserer Anwendung kommen so in den Genuss, detaillierte Informationen zur Barrierefreiheit von Objekten auch offline erfassen zu können. Sobald sie wieder Internetverbindung haben, werden die Daten mit dem Server abgeglichen.
