Blog

Vaadin 15 is here

By  
Kavish Weerawardane
Kavish Weerawardane
·
On Mar 5, 2020 10:09:42 AM
·
In Product
Vaadin15Banner-2

When Vaadin first launched nearly 20 years ago, it focused on doing one thing: allowing developers to build UX-first web applications using Java, in a cleanly-abstracted environment.

Vaadin’s powerful abstraction capabilities are now one of its defining features: it provides a cost-effective solution to deploy complex web applications quickly. Today, the Vaadin platform is trusted by the world’s largest enterprises and governments to run mission-critical parts of their infrastructure.

However, sustained success requires continual iteration and reinvention.
So, we drew inspiration for the latest version of the platform from our greatest strength: the Vaadin community.

We noticed that a steadily-growing number of Java developers work in hybrid full-stack teams alongside front-end developers. These teams often develop progressive web applications (PWAs) for an increasingly-mobile workforce, and require features like robust offline functionality and precise access to elements conventionally abstracted by Vaadin.

Enter Vaadin 15.

Want to learn more about progressive web applications (PWAs) in Vaadin? Visit our dedicated PWA page.

One Vaadin, two UI development options

Vaadin 15 is the first version of Vaadin to offer developers two unique UI development models, both of which share Java on the server-side. This means that Vaadin’s core focus on simplicity, components, themes, design principles, type safety, and DX remain unchanged.

First, we have Vaadin’s signature Java-only approach to UI development. This continues to offer the simplicity afforded by Vaadin’s powerful abstraction and the unparalleled security of executing all UI code on the server.

In addition, Vaadin 15 ships with the option to build type-safe stateless views using TypeScript on the client-side. This allows developers to stay close to the target platform (the browser) and utilize any native Web-platform features (such as service workers) directly. It also introduces offline support in Vaadin, which will be further developed in future releases. Vaadin will make sure that your UI code seamlessly and securely connects to your Java back-end.

Going forward, Vaadin will support both UI development options equally. Each will be maintained and updated by a dedicated product team with one directive: to continually upgrade their option to be lighter, faster, and even more functional. This means that you can expect a steady flow of cool new features, performance enhancements, and more for both UI development options.

Can’t wait to try out Vaadin 15? Visit our start page and dive right in!

Stateless views & offline support powered by TypeScript

Vaadin 15 allows you to add browser-based stateless TypeScript views to both existing and new Vaadin applications.

All you need to do is define an endpoint and Vaadin 15 will create the client TypeScript code for the endpoint methods and used entity types.

import com.vaadin.flow.server.connect.Endpoint;

/**
* A Vaadin endpoint that counts numbers.
*/
@Endpoint
public class CounterEndpoint {
  /**
  * A method that adds one to the argument.
  */
  public int addOne(int number) {
    return number + 1;
  }
}

TypeScript views seamlessly work together with any existing Java views. This means that you can choose how much of the UI is written in either language, while also enabling a gradual migration to a fully TypeScript-based UI.

Finally, Vaadin 15 handles routing and bootstrapping on the client-side, allowing you to create offline apps with ease. Vaadin’s very own Artur created a lightweight mortgage calculator to demonstrate this. You can check it out here and try it out yourself.

pnpm support for faster builds that use less storage

Performant npm has arrived. Vaadin now supports pnpm, a drop-in replacement for npm, which is more effective at front-end dependency management. pnpm works by caching packages into a centralized local store and linking them across your projects, instead of downloading them separately.

Skipping the conventional npm download procedures in recurring builds, means greatly reduced disk space usage and faster project initializations.

Vaadin 15 still uses npm by default, but enabling pnpm is as simple as using the pnpm.enable system property.

For detailed instructions, refer to our pnpm migration tutorial.

An updated form-building experience

Forms are a crucial building block in many applications, and Vaadin 15 implements several key enhancements to the form-creation experience.

The improvements include a new “save-as-draft” function and the ability to trigger bindings between required and non-required states.

For more information, visit the Vaadin 15 release page.

Is Vaadin 15 right for you?

Vaadin 15 is our first entry into the development of client-side UI logic. It is also a cutting-edge release, with a shorter support lifecycle. As such, Vaadin 15 will be supported until July 2020-- or one month after the release of Vaadin 16 in June 2020.

We encourage developers who may need browser-based views and TypeScript support to try out Vaadin 15, and provide us with feedback.

However, if your long-term web application deployment doesn’t need these features right away, we recommend you go with the latest release of our current LTS (long-term support) version, Vaadin 14. Most of Vaadin 15’s tertiary features, such as pnpm support and binder improvements, will soon make their way into Vaadin 14.

Vaadin 15 now supports the latest versions of Edge Chromium, Chrome, Firefox, Firefox ESR, and Safari, but drops IE 11, Edge (EdgeHTML engine), and Safari 9-12. In addition, a number of deprecated APIs, Bower (compatibility mode) and WebJars are no longer supported.

Please see the Vaadin 15 release page and the Flow 3.0 release notes for a complete list of breaking changes.

Learn more about Vaadin 15

Alejandro Duarte & Viktor Lukashov just hosted a live webinar discussing Vaadin 15 and the future of the platform. Watch it here.

Kavish Weerawardane
Kavish Weerawardane
Kavish leads our product marketing team in bringing exceptional developer and enterprise focused products to market. He is particularly passionate about design systems, UX & real-time collaboration technologies.
Other posts by Kavish Weerawardane