ChameRIA - Desktopanwendungen mit HTML5

Die Grenzen zwischen Web und Desktop überwinden

Daniel Bremer-Tonn und Clement Escoffier

Der Backend-Bereich setzt auf Java und OSGi als Laufzeitumgebung. Damit ist die Basis für eine komponentenbasierte Architektur geschaffen. Die Kopplung von Frontend und Backend geschieht allein auf der Basis von HTTP mittels JSON-RPC. Der zugehörige Buildprozess basiert auf Maven und erlaubt das komfortable Bauen und Testen der Anwendung. Die strikte Trennung von Frontend- und Backend-Komponenten erlaubt sowohl eine verteilte als auch rein lokale Ausführungsvariante. Einen Überblick über die Architektur von chameRIA gibt Abbildung 3.

Abb. 3: chameRIA Architektur

Die gesamte Anwendung wird in einem OSGi Container [3] ausgeführt. Für die Serviceschicht setzen wir iPojo [4] ein, womit sich auf einfache Art und Weise POJOs als OSGi-Servicekomponenten nutzen lassen.

Die Webview ist für die Integration der entsprechenden Webkit-Version zuständig und bildet damit den grafischen Teil der Anwendung. Die Frontend Bundles enthalten sämtliche statische Ressourcen wie HTML- oder JavaScript-Dateien. Diese werden über den HTTP-Service der Webview angeboten und dort entsprechend dargestellt. Die Backend-Komponenten bieten ihre Services als JSON-RPC an und sind damit über JavaScript direkt aufrufbar. In den Backend-Komponenten ist dank Java auch eine Integration von nativen Komponenten möglich.

Die Frontend-Komponenten sind komplett in HTML5, CSS3 und JavaScript implementierbar. Bei der Wahl der eingesetzten JavaScript Frameworks sind keine Einschränkungen gegeben. Bei unseren Projekten hat sich jQuery [5] aufgrund der unkomplizierte Einbindung von Animationen und der Vielfalt an Plug-ins bewährt.

Bei unseren ersten Versuchen mit größeren Implementierungen in JavaScript zeigte sich schnell, dass Unterstützung für die Modularisierung von JavaScript vonnöten ist. Mit unserem selbstentwickelten JavaScript Framework H-UBU [6] ist die Umsetzung einer komponentenbasierten Architektur auch in JavaScript möglich, und die Organisation des Quellcodes sowie die Testbarkeit werden erheblich vereinfacht.

Die Verbindung zwischen den Backend Services und den Frontend-Komponenten geschieht für den Anwendungsentwickler transparent. OSGi Services auf der Java-Backendseite sind automatisch via JavaScript auf der Frontendseite aufrufbar. Ein Beispiel einer Kommunikation zwischen Frontend und Backend zeigt die Abbildung 4.

Abb. 4: Zugriff auf den Backendservice mit Javascript
ChameRIA-Einstieg

Für einen schnellen Einstieg steht ein chameRIA Maven Archetype zur Verfügung:

$ mvn archetype:generate  -DarchetypeArtifactId=chameria-quickstart-archetype    
-DarchetypeGroupId=de.akquinet.chameria  
-DarchetypeVersion=1.5.0 
-DgroupId=your.company 
-DartifactId=chameria-quickstart-application

Der Archetype erzeugt eine bereits fertige kleine Beispielanwendung für die Plattformen Windows, Mac und Linux (Abbildung 6):

$ cd chameria-quickstart-application  
$ mvn install
$ cd target
$ cd win | mac | linux
$ launch-win.bat| launch-mac.sh | launch-linux.sh

Abb. 6: Beispielanwendung des Maven-Archetypes
Beispiele

Wir haben chameRIA erfolgreich in mehreren Projekten eingesetzt. Der vorgestellte E-Book Reader (siehe Abbildung 1) konnte mit diesem Technologie-Stack erfolgreich umgesetzt werden. Durch die Verwendung von HTML5 für das Markup und CSS3 für das Styling konnten wir reine Oberflächenexperten ohne Java-Know-How einsetzen.

In einem anderen Projekt wurde eine Anwendung entwickelt, die Betriebsdaten von Elektromotoren ausliest und anhand der Werte den Wartungsbedarf ermittelt. Neben der Ansteuerung einer seriellen Schnittstelle zur Kommunikation mit den Motoren war die grafische Anzeige der verschiedenen Daten gefragt. Die Ansteuerung der seriellen Schnittstelle konnte durch das Java-basierte Backend ohne Probleme umgesetzt werden (Abb. 5).

Abb. 5: Monitoring von ElektromotorenAbb. 5: Monitoring von Elektromotoren (Vergrößern)

Fazit

Für besondere Anforderungen an das UI von Desktopanwendungen sind oft traditionelle Frontendtechnologien wie Swing nur bedingt geeignet. Je spezieller das UI-Design ist, umso schwieriger wird die Umsetzung. Neben erhöhtem Aufwand wird auch schwer zu beschaffendes Expertenwissen benötigt. Durch die starke Verbreitung von Wissen und Erfahrung im Webbereich mit Technologien wie HTML und JavaScript stellt sich die Frage nach der Wiederverwendbarkeit für den Desktop. Mit Hilfe von chameRIA ist es möglich, die Vorzüge von Java und OSGi im Backendbereich mit den Möglichkeiten von HTML5 und JavaScript für den Frontendbereich in einer plattformunabhängigen Desktopanwendung zu kombinieren. ChameRIA wurde erfolgreich in Projekten eingesetzt und wird ständig verbessert und weiterentwickelt. Weiterführende Informationen rund um ChameRIA sind unter http://chameria.spree.de zu finden.

Daniel Bremer-Tonn ist Senior Engineer bei der akquinet tech@spree GmbH und Mitglied des Competence Centers Innovation. Sein Hauptfokus liegt auf der Nutzung aktueller Webtechnologien für die Implementierung von Anwendungen für das Web und Desktop auf Basis von JEE und OSGi.

Clement Escoffier ist Leiter des Competence Centers Innovation bei der akquinet tech@spree GmbH. Er ist PMC-Mitglied von Apache Felix und Hauptverantwortlicher der Projekte Apache Felix iPOJO und OW2 Chameleon.

Geschrieben von
Daniel Bremer-Tonn und Clement Escoffier
Kommentare

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.