Architektur

Um den modularen Aufbau zu ermöglichen ist es notwendig die Basisplatform (Homescreen und Off-Canvas) von den einzelnen Funktionlität der Module zu entkoppeln.

Der Kern dieser Modularisierung ist RequireJS. In der Bootstrap Phase der App wird die Datei “modules.js” angefordert. In dieser Datei müssen Module, die die App zur Verfügung stellen soll registriert werden, so dass Require JS diese Module ebenfalls lädt.

Der Contract zwischen Module Runtime und den einzelnen Modulen wird in dieser zu registrierenden Datei (“module.js” für jedes Modul) implementiert. Ein Modul muss einen Namen, einen Einstiegspunkt als Anchor sowie ein Icon bereitstellen - diese Informationen verwendet die Runtime zur Erzeugung des Homescreens.

Ein Modul startet in dieser Phase einen eigenen Router der auf eben diesen Einstiegspunkt in das Modul hört und kann so die Kontrolle übernehmen, wenn der Homescreen die entsprechende URL aufruft.

Bootstrap-Prozess

In der zu Beginn leeren index.html werden neben den CSS-Dateien die Skripte „require-config.js“ und „bootstrap.js“ im Kontext von „require.js“ geladen.

Die Konfigurations-Datei von RequireJS definiert den Namen der einzelnen Bibliotheken, worüber diese in der gesamten Web-App ansprechbar sind und beinhaltet die Pfade sowie mögliche Abhängigkeiten zu anderen Bibliotheken.

Ein Shim-Objekt regelt die Abhängigkeiten zu anderen Bibliotheken und veranlasst, dass diese vorher geladen werden. Dadurch wird verhindert, dass es zu Fehlern kommt, wenn beispielsweise Backbone vor jQuery und Underscore geladen wird.

Die „bootstrap.js“ lädt Backbone und damit auch die davon abhängigen Bibliotheken jQuery und Underscore, Fastclick sowie die Basisview der App. “bootstrap.js” startet das asynchrone laden der Module und stellt deren Schnittstellen (Implementierung des Contracts) in einem eigenen RequireJS-Modul bereit. Die HomeView kann dieses RequireJS-Modul verwenden um die App-Module zu starten.Im Anschluss daran der BaseRouter erstellt, der auf die URL “/” reagiert und daraufhin den Homescreen rendert.