• Von Jimi Steidl
  • Veröffentlicht am Donnerstag, 12. Oktober 2017 - 10:00

Flux Application Architecture

In der Welt der Frontend Entwicklung existieren zahllose Frameworks in allen möglichen Sprachen, doch die meisten haben eines gemeinsam: Die Architektur. Seit vielen Jahren ist hier Model-View-Controller (MVC) Pattern der Platzhirsch, mit wenigen Model View ViewModel (MVVM) Vertretern.

Anwendungen werden immer komplexer und man konnte beobachten, dass Implementierungen des MVC-Musters sehr schlecht skalieren. Der bidirektionale Datenfluss zwischen Controller und View führt zu schwer nachvollziehbaren Zusammenhängen, speziell wenn eine View auf eine andere verweist oder Controller Views aktualisieren müssen, die nicht direkt zu ihnen gehören.

Hier hat Facebook angesetzt und mit Flux eine Applikationsarchitektur geschaffen, welche Lösungen zu diesen Problemen bietet.

Das Konzept ist einfach: Unidirektionaler Datenfluss in allen Schichten der Applikation (siehe Grafik).

Es gibt drei Hauptkomponenten zu jeder Flux Applikation. Der Dispatcher, die Stores und die Views.

1. Der Dispatcher existiert nur einmal pro Applikation und agiert als zentraler Manager des Datenflusses. Er hat keine eigene Logik, sondern verteilt Actions an alle Stores.
2. Die Stores beinhalten typischerweise logisch zusammenhängende Teile des Applikations Zustandes und die zugehörige Geschäftslogik wie diese Zustände zu verändern sind. Stores können Actions zum Dispatcher schicken.
3. Die Views zeigen die Daten aus den Stores für die User an und User können Actions auslösen welche zum Dispatcher gesendet werden.

Dieser Blogbeitrag entstand im Zuge einer Architekturumstellung von MVC auf Flux in einer sehr komplexen Komponente des Userinterfaces in einem unserer Projekte. Eine komplizierte Berechnung, bei der User-Eingaben, Daten vom Server, sowie eine Websocket-Verbindung vom Server zum Client Einfluß auf das Ergebnis hatten, war sehr fehleranfällig. Durch die neue Architektur war der Bug schnell gefunden und behoben. Wir möchten andere Entwickler dazu anstoßen, sich doch wieder Gedanken über das Thema der Frontend-Architektur zu machen, ein Problem, welches lange eine selbstverständliche und eindeutige Lösung hatte.

26 Sep

Summit 2017

Von Camilla Franek

Dieses Mal blieb es bis zur letzten Sekunde ein Geheimnis was uns auf unserer diesjährigen Summit in Bratislava erwarten würde. Für 27 helle Köpfe ging es von 14. - 16. Oktober in die Hauptstadt der Slowakei - die Vorfreude war groß, hatten wir doch die letzten Summits in bester Erinnerung ...


Neueste Artikel

  • Flux Application Architecture

    12.10. / Jimi Steidl

    In der Welt der Frontend Entwicklung existieren zahllose Frameworks in allen möglichen Sprachen, doch die meisten haben eines gemeinsam: Die Architektur. Seit vielen Jahren ist hier Model-View-Controller (MVC) Pattern der Platzhirsch, mit wenigen Model View ViewModel (MVVM) Vertretern. Anwendungen werden immer komplexer und man konnte beobachten, dass Implementierungen des MVC-Musters sehr ...

  • Summit 2017

    26.09. / Camilla Franek

    Dieses Mal blieb es bis zur letzten Sekunde ein Geheimnis was uns auf unserer diesjährigen Summit in Bratislava erwarten würde. Für 27 helle Köpfe ging es von 14. - 16. Oktober in die Hauptstadt der Slowakei - die Vorfreude war groß, hatten wir doch die letzten Summits in bester Erinnerung ...

  • Fokussiere deine Verbesserungen

    21.09. / Arjan de Jong

    Wer in einem agilen Team gearbeitet hat weiß, dass fast jedes Team durch externe Gründe irgendwann zum Stillstand gebracht wird. Existierende Probleme werden in agilen Vorgehensweisen schnell sichtbar, da diese Vorgehensweisen in kurze Iterationen geliefert werden ...

  • Coding Standards und deren Anwendung

    12.09. / Christoph Gostner

    Sourcecode wird öfter gelesen als geschrieben. Dies ist eine Tatsache, die man nur schwer verneinen kann. Oft müssen neue Features implementiert werden, wobei erst die richtige Stelle gefunden werden muss, um diese umzusetzen ...