A lot of time has passed between RapidClipse 3 and the new version 4 and there seems to be no innovation in terms of UI. The following article explains the not so trivial issue and the decisions we had to make.

HTML5 User Interfaces with Vaadin

For the development of modern HTML5 interfaces, RapidClipse has relied on the UI framework Vaadin from the beginning. Other UI frameworks would also have been considered for RapidClipse in principle, e.g. the Java UI framework Google Web Toolkit, which was renamed GWT after the code was handed over to the community. However, Vaadin is still the only UI framework that provides both the server and the client part and manages the permanent communication between both parts fully automatically, so that you do not have to worry about it as a developer. With GWT, the result is just a pure web client. As a developer, you have to take care of the associated server and the communication between client and server yourself. In addition, the programming model of Vaadin is comparable to Java Swing, which is still widely used in the Java environment.

The UI framework Vaadin consists of 2 parts:

• Java server framework
• UI client with JavaScript UI widget set

Short review – The Google Web Toolkit era until Vaadin 8

12 years ago, the Vaadin developers integrated the Google Web Toolkit into the Vaadin framework to create the entire Vaadin UI front-end using GWT. GWT is a pure Java UI framework including a pre-compiler that compiles the UI code written in Java to JavaScript code that can then be executed in the web browser (the UI client). The advantage for the Vaadin team was on the one hand that GWT already brings all important browser optimizations, so that neither the Vaadin team nor Vaadin users have to worry about it. On the other hand GWT was still completely developed by Google at that time. They developed own important applications with it, which not only demonstrated the possibilities, but also guaranteed best possible support and further development. For Vaadin users to not come into contact with GWT itself, however, the Vaadin framework provides an already precompiled UI widget set. Since the GWT components were not a visual highlight, Vaadin has developed its own modern CSS theme for them: the Vaalo theme. At runtime, the entire JavaScript UI client is then dynamically generated by the server-side Vaadin Java framework. Via databinding, the Vaadin/GWT JavaScript UI widgets in the browser are connected to the Vaadin server part. The server part takes care of the data transfer fully automatically. Up to Vaadin 7 there was no deviation from this architecture.

Always the same problem with UI frameworks

For as long as anyone can remember, UI development with JavaScript frameworks has been a big challenge. Each JavaScript framework brings its own UI widget set, architecture and programming model. This has resulted in the same problems over and over again. Either certain widgets are missing, the design is not appealing, the development of own UI widgets is extremely complicated, the framework developers want to make everything better after a short time and break the backward compatibility with new versions, do not keep up with browser adaptations or simply exclude certain platforms and versions or the framework is no longer developed at all. JavaScript frameworks that are no longer being developed are, however, unusable after only a short time and web projects based on them have to be migrated at enormous expense. Due to numerous new projects at Google such as AngularJS, Dart etc., the initial hype around GWT also flattened out strongly. Today, GWT has only a comparatively low significance.

Web-Components – finally future-proof HTML interfaces

The solution to the problem of mutually incompatible UI libraries is to be solved by a new standard: Web Components. Web Components are JavaScript UI components that are based on an architecture standardized by the W3C, bring their own code with them, can run compaletely independently of any particular UI framework, are supported by all browsers, are displayed and behave in the same way, can be integrated into any HTML page using ordinary HTML tags, and can thus also be combined and reused together with any JavaScript framework. Annoying and expensive migrations from one hip UI framework to the next will finally become obsolete. Web components are already natively supported by most browsers. The Polymer framework developed by Google ensures that web components also work in all other browsers. Web components are the UI technology of the future.

Vaadin begins development of Web Components

Around 2014, Vaadin started working on a completely new UI widget set, no longer based on GWT, but consisting of web components. From our point of view, this was a brilliant decision. Vaadin recognized the advantage of web components much earlier than other UI framework vendors, making it one of the web component pioneers. Moreover, Vaadin realized that a Web-Components library is not only needed for their own Vaadin framework, but that they can also address the whole JavaScript library market with it. Vaadin therefore decided to market the new Web-Components also independently from the classic Vaadin framework. The splitting into 2 independent products followed:

1. COMPONENTS - the pure, client-side web components, which can now also be used by JavaScript developers, and
2. FLOW - the original server-side Vaadin framework for Java developers.

New databinding for Web Components

In order to use web components in the Vaadin framework, Vaadin had to develop a new databinding. But instead of exchanging UI components and databinding in one go, the new databinding was first introduced with Vaadin 8. With Vaadin 10 the GWT components should then be replaced by the new web components.
For users who want to start with a new project, it is advantageous to be able to use the new databinding right away. For users of existing Vaadin 7 projects a new databinding means migration effort and the following change to Vaadin 10 again - thus double migration effort.

Vaadin 8 – only an intermediate step

Ensuring that existing Vaadin 7 projects do not have to be migrated twice, a so-called compatibility layer was introduced for Vaadin 8, with which it should be possible to continue to operate Vaadin 7 applications with Vaadin 8 without migration effort.
With this feature, we wanted to ship RapidClipse 4 with Vaadin 8 already in 2017. However, we found that the compatibility layer did not support important Vaadin 7 features at all. Since Vaadin 10 was already in development at that time, we decided to skip Vaadin 8 and wait for Vaadin 10 – thus postponing RapidClipse 4 until Vaadin 10 is released, or waiting until Vaadin 10 is stable first.

Vaadin 10 –  Introduction of the new but half-finished Web Components   

With Vaadin 10, Vaadin finally replaced the GWT-based UI stack with the new web components. However, with version 10, Vaadin could not provide a widget palette even close to Vaadin 7 in scope. For almost half of all Vaadin 8 components there was no replacement. Besides components like Accordeon, DateTimeField, PopupView, ContextMenu etc. even elementary important components like Tree, CheckBoxGroup, RichTextArea and MenuBar were missing.

Delivering RapidClipse 4 with Vaadin 10 would have meant that new projects would have had to live with severe limitations compared to RapidClipse 3. And the migration of already existing RapidClipse 3 projects would have been equivalent to a complete redevelopment of the entire interface – but with significantly less functionality.

Web Components only really ready this year with Vaadin 14

At Oracle Code One 2018 in San Francisco, Vaadin communicated that they expect to have regained the scope of the UI widget palette of Vaadin 8 with Vaadin 14, but thanks to the very early release with Vaadin 10, it will be mature and stable by then. Vaadin 14 will be available in June 2019.

Switch to Web Components came too early. RapidClipse skips 5 Vaadin versions.

It is understandable that Vaadin wanted to get its foot in the door as early as possible in the super-short-lived JavaScript environment by releasing the new Vaadin Components early, and to become the first producer of an extensive Web Components widget palette if possible. However, integrating the new Web Components so early, half-finished into the server-side Java framework Vaadin 10, was very unfortunate for the RapidClipse project, since we could not possibly ship RapidClipse 4 with Vaadin 10. Since only Vaadin 14 will have the necessary scope we need for RapidClipse, we decided to skip Vaadin versions 8, 10, 11, 12, and 13.

Outlook for RapidClipse 5

Since a complete and mature Web Components palette will soon be available with Vaadin 14, we plan to ship RapidClipse 5 with Vaadin 14 and thus also migrate RapidClipse 5 to Web Components.

To handle Web Components, the RapidClipse GUI builder has to be completely reworked. The development work is already in full swing. Since a new data binding is also necessary, the entire RapidClipse framework has already been rewritten to support web components.

With the new web components, interfaces developed with RapidClipse will not only be much more performant, but also the development of mobile apps will be greatly improved. In addition, the integration of any other web components will greatly increase the overall possibilities with RapidClipse.

Web components are the new standard in web front-end development. With a web application based on Web Components, you benefit from unprecedented stability and investment security in the field of web development.

RapidClipse 5 launch in September at XDEVCON 2019

Our goal is to introduce RapidClipse 5 at this year's XDEVCON, which will take place in Düsseldorf, Germany, September 24-26, 2019. RapidClipse 5 will be the most significant RapidClipse release since the beginning of the entire RapidClipse project. If you are already developing with RapidClipse or are interested in RapidClipse, then you should definitely come to XDEVCON 2019 this year. XDEVCON 2019 is the big RapidClipse conference. Here you will experience up to 20 talks on RapidClipse - from introduction to expert topics as well as exciting field reports from great RapidClipse users and have the opportunity to meet the RapidClipse team in person.

Register right now for XDEVCON 2019