Here are the highlighted new and improved features in the Vaadin 12 release. There are a lot of bug fixes and smaller improvements not mentioned here, but in the platform release notes.
App Layout is a component to be used as the main layout of your application. It gives you a content area and a responsive navigation bar, which is displayed at the top on larger screens and the bottom on smaller screens. Supports setting one level of navigation elements with an icon and a text. You can also set a branding text or image to be shown.
The new Checkbox group component simplifies working with multiple values produced by the contained Checkboxes.
Context Menu web component now has a server-side Java API for adding a context menu for any Vaadin component. Vaadin Grid has support for handling context menu item clicks for each row.
CRUD stands for Create, Read, Update, Delete. The CRUD component is a quick way to make a list of entries editable. It gives you a Grid listing all the entries and an editor for the entries. You can click a row to edit, press new item to add a new one and press delete to remove. Vaadin CRUD is a database agnostic component.
An input field for selecting a time with a mouse, keyboard or touch device.
TreeGrid feature was available for the Grid web component already earlier, but now it’s available for Vaadin Flow users as a separate Java component. Display hierarchical data in a data grid with tree-like expandable items.
It is now possible to allow the users to edit the data directly in the Grid component. Like before, both buffered and non-buffered versions of the editing are supported. Now it is also possible to change the used editor component on the fly depending on the data. See the demos for usage examples.
<vaadin-grid> convenience columns and properties eliminate lots of previously required boilerplate wiring in the most typical use cases.
When using large data sets, the component doesn't send all the data to the client immediately. Instead, the client requests smaller sets of data as needed, as the user scrolls down the overlay.
<template> tags together with Polymer syntax data-binding is no longer required with the newest generation of Vaadin's Web Components. Instead, a developer can assign a "renderer" function hook to components such as
All Vaadin web components are available also as npm packages in addition to Bower. You should not mix Bower and npm versions in the same application. Flow still uses Bower and WebJars for frontend dependencies.
The Material theme for Vaadin components is an implementation of Google’s Material Design specs. The new theme is an alternative for the default Lumo theme, and both are also supported in the future.
Now there is a Java API for choosing an alternative built-in component style from Lumo or Material theme for any of the components that have a variant. The theme variants are exposed as constants.
With a separate
vaadin-cdi module, you can make Vaadin components CDI managed beans and start using
@Inject. There are custom contexts for Vaadin Service, Session, UI, and Route.
The Vaadin platform can now be used in OSGi applications.
The best way to get started is to take the Project Base for Flow and OSGi to start making your web application bundle for OSGi container.
All progressive web applications have the same common features that enable the native-app-like behavior. With a simple annotation, Flow will automatically serve web manifest, service worker, icons, offline page and a prompt to install the app on home screen.
Multiplatform Runtime lets you run your Vaadin 7 or Vaadin 8 application inside Vaadin Flow application. The runtime works as an adapter so that Flow understands your legacy components. Legacy components and the Vaadin platform components can live together on the same view at the same time.
Server-side memory optimizations reduce the heap size significantly. For example, the Beverage Buddy Starter sees 48% reduce down to 134KB per session with one UI open.
Internal improvements make the first loading of the UI faster after a server restart. For example, the Beverage Buddy application MainView opens 50 % faster than before and the editor dialog load time is reduced by 85 % to 330ms.
Redesigned user experience based on user feedback. New Palette, Outline and Properties. Preconfigured snippets for components and bigger UI patterns to get started quickly.
Change the component theme for viewing designs. You can choose either Valo or Material theme. For a complete control over the styling, you can also choose not to have any theme applied.
For users of Vaadin 10 or later, updating the version number in the vaadin-bom is enough. Notice, that a few breaking changes were introduced in vaadin-combo-box. See Combo Box release notes for more details.