Hinweis: Die aktuelle OOP-Konferenz finden Sie hier!
SIGS DATACOM Fachinformationen für IT-Professionals

Managing Today's Challenges

München, 03. - 07. Februar 2014


Mastering Complexity of HTML5 Rich Clients

Uhrzeit:17:00 - 18:00
Vortrag: Mi 2.4

UIs of HTML5 Rich Clients are challenging: nested UI dialogs, complexity caused by JavaScript, UI rendering performed by UI toolkits with different programming models, and "head-less" testing requirements. A modern UI reference architecture addresses this by allowing to base both static code structure and dynamic run-time communication on the hierarchical decomposition of the UI into a tree of DOM-agnostic stateful components. We provide details into the reference architecture, the ComponentJS reference implementation and example applications.

Target Audience: Architects, Developers
Knowledge in implementing UIs and the HTML5 technology stack

You will learn:
Software architects and software developers will be able to address the challenges of complex HTML5 based Rich Client UIs by understanding how to master the complexity on both the architecture and implementation level.

Extended abstract:
Implementing User Interfaces (UI) as HTML5 Rich Clients (aka Single-Page-Apps, SPA) is a major challenge: those UIs have both a high inherent complexity coming from the usual nesting of User Interface dialogs and an additional accidental complexity caused by the weak structuring support of the underlying JavaScript programming language. Additionally, the UI rendering in HTML5 Rich Clients is performed by various UI toolkits and those are based on different programming models (DOM Enrichment or Technology-abstracting Object Graphs). Finally, true "head-less" testing of such UIs during the Continuous Integration steps is complicated and requires tricks.
For mastering these challenges, a modern UI reference architecture was developed which is strictly based on the proven architecture principles Component Orientation, Loose Coupling, Separation of Concerns, Model-View Separation and Hierarchical Decomposition. It allows one to directly base both the static code structure and the dynamic run-time communication on the Hierarchical Decomposition of the UI into a run-time tree of DOM-agnostic stateful composite and widget components. As the architecture has to be supported by a run-time component system, a sophisticated UI-toolkit independent reference implementation exists with ComponentJS.
This presentation provides insights into the reference architecture, the ComponentJS reference implementation and various desktop and mobile applications from practice, based on top of both.