Why use SAP OpenUI5?
- The amount and coverage of UI controls offered by the library;
- If it has databinding capabilities, which is the underlying technology that makes possible a true Model-View-Controller (MVC) client side implementation;
- Supported data sources for databinding (OData, JSON, XML);
- A responsive layout strategy to fully embrace the mobile first design approach;
- Performance of the UI controls in different browsers, taking into account memory and CPU usage;
- If it is stable, reliable, frequently updated, and with a strong market adoption.
In order to fulfill these user interface needs and objectives, we usually need to use a combination of frameworks. This combination has to be carefully chosen to avoid technical conflicts and overlapping features. To achieve the mentioned goals we suggest the combination of 3 technologies:
- Wijmo by GrapeCity or Kendo UI by Telerik - both are a third party UI control library built on jQuery;
- Bootstrap - a CSS framework for responsive layouts.
Advantages and disadvantages
OpenUI5 offers all these possibilities in a (almost) single framework based on jQuery and jQuery UI, which is, in terms of usage, very similar to jQuery UI widgets. This makes it very easy to use for most developers who worked previously with jQuery UI.
Based on our needs, OpenUI5 shows some great advantages:
- The number of controls and components offered by OpenUI5 is wide and keeps growing on every release. They cover most of the needs of a typical business application (menus, data grid, collapsing panels, forms, etc.);
- Databinding capabilities, allowing the use of MVVM/MVC design patterns with local JSON and XML models, as well as remote OData data sources;
- Responsive layout engine built into all UI controls, which allows them to be used on both mobile and desktop browsers;
- Ability to create new redistributable UI components;
- Built-in internationalization and localization support;
- It is developed by SAP, has a three month release cycle, and is the core framework for all SAP Fiori apps.
But we also encountered some disadvantages:
- Low flexibility to change the behavior and look and feel of existing components and controls (though OpenUI5 has a UI theme designer);
How does OpenUI5 fit to a Microsoft ASP.NET MVC web application?
One of the key questions that we had to put to ourselves was: will we be able to keep our development methodologies and technologies with OpenUI5 as we did with previous libraries?
We build our applications based on industry standard design patterns, mainly Domain Models, Data Access Layer, Repositories, and Service Layer. These patterns, including dependency injection, allow us to have a separation of concerns that makes unit testing possible on all layers where the business logic resides.
Based on our development methodologies, OpenUI5 would appear on the last layer – the web based user interface. We evaluated the use of OpenUI5 for web applications developed in the .NET Framework ASP.NET MVC, without losing the built-in capabilities of form submissions, model validation, partial web page refresh, and – the most important one – the URL routing system that transforms HTTP operations over URLs to the invocation of MVC actions (methods) on controllers (classes). The OpenUI5 architecture leans towards the implementation of single page applications (also known as SPAs or OPAs – one page applications) with client side views and a single URL for the entire application, which would completely invalidate the server side ASP.NET MVC coding with Razor views.
This architecture has the following benefits:
The use of a comprehensive UI control library frees developers from having to create low level HTML5 and CSS3 coding of user interface components. These handmade components are often made using a combination of server side and client side coding, increasing code complexity and maintenance. With OpenUI5 the developer can focus only on choosing the most appropriate component for the desired user interface. Creating a new OpenUI5 theme for corporate branding of a business application can be offloaded from the application developers to a separate design team.