Vaadin pre-releases moved to new repository

We are getting closer to releasing our next minor release, 7.6. There has already been 7 alpha pre-releases and we hope to call them betas in the next couple of weeks. We encourage developers to use, or at least try, our pre-releases when working with projects without strict deadlines. This is an easy way to contribute to the Vaadin project by giving us some early feedback on new features, when we can still change, for example, the newly introduced APIs. And you can also enjoy all awesome new features earlier than your competitors ;-).

Recently, we changed the way how we publish our pre-releases. Earlier we just pushed everything to the Maven central repository, but now we use a separate repository,, for unstable releases. After this change has been fully completed, autocompleting the version number of a dependency in your IDE should show a bit more relevant list, new projects you create with archetypes defaults to the latest stable release and, during development phase, your project can use special versions, like LATEST or RELEASE with Maven.

How to use a Vaadin pre-release

  1. Go to
  2. Select the latest pre-release from the right hand box. It’s the topmost link.
  3. In the same panel, further down, there is a box containing a repository definition - add this to your pom.xml (or similar entry to ivy.xml or build.gradle if you’re using IVY or Gradle.
  4. If you are using Maven, and also want to use the latest vaadin-maven-plugin, add a entry with the same URL.
  5. Update the Vaadin version number to the pre-release of your choice
  6. Try it and post your findings via

There is also a simple example project that uses Vaadin 7.6.0.alpha5 from the new pre-release repository.

Alternatively, if you are playing around with Vaadin pre-releases often, you can configure your global settings, or just some specific profile, to include the Vaadin pre-release repository. See Maven settings help page for more details on how to do this.

Try Vaadin 7.6 today

Minimized Vaadin servers for IoT solutions

Trimming down the last bytes of deployment artifact size and server startup time has never really been a top priority for business app developers. These measures just need to be within reasonable values, and are seldom essential things in business applications, neither in development or production environments.

Lately we have seen a lot more interest in using Vaadin UIs in embedded systems and IoT solutions, and sometimes running Vaadin based UI’s from really light weight servers, where you want to save all the bytes you can. To help Sven Ruppert with his Vaadin related projects and to finalize my “make jar not war” week, I hacked together two examples with minimalistic jar packaged server+Vaadin setups.

Undertow + Vaadin ~ 5MB

Undertow is a new sleek web server powering the WildFly application server, which can also be used as a plain servlet container for embedded systems weighing only a couple of megabytes. Also, you can use a programmatic way to define your deployment, freeing your app server of expensive classpath annotation scanning and/or web.xml parsing during startup. The startup time of this kind of server is never measured in seconds :-)

By default Vaadin will add some libraries and source files to the setup and increase the size of the generated überjar closer to 20 megs, but you can get rid of most of the overhead.

These are the tricks I did to bring the jar file size down to about five megabytes:

  • - This service moves the static files generated by GWT compilation into the cloud. And it also does the same for compilation, so there is no need for a vaadin-client-compiled module or the most commonly used setup with an application specific widgetset. The setup also frees some resources from your application server to do more intelligent stuff. This is a great way to save bandwidth if you trust our community maintained CDN and can rely on your end users having an internet connection. The Maven plugin generates a web listener that needs to be registered to the deployment info.
  • Dawn theme - The Dawn theme is a slimmed version of our official Valo theme that delegates font serving to Google’s free font service. I also moved Dawn to be served from an external domain. Note that if you need to serve the theme from your minimalistic server, you probably still want to filter out all scss files as .css.gz and .gif files are all you need from the package during runtime.
  • Excluded sass compiler and other optional dependencies - Vaadin by default supports compiling your theme at runtime. I pretty much always exclude all dependencies related to it as I want to compile my themes in a separate project. The vaadin-server module also contains all server side stuff from GWT projects (Vaadin embeds GWT), which are also almost never needed: I rudely excluded all packages from the überjar.

If you can’t rely on an Internet connection e.g. for some intranet systems, you can still use “CDN-style” methodologies with widgetset and theme. Just set up a separate server into your local network to deliver these static resources, and setup your build so that files generated by theme and widgetset compilation get uploaded to it.

The example setup is available in GitHub.

Jetty 9 + Vaadin = 3.4MB

Jetty has for a long time been the favorite in these kind of embedded java server setups. I took an example by Sami Ekblad and fine-tuned it with similar tricks as with Undertow, and its artifact became even smaller, only 3.4MB. If you can manage with an older version of Jetty (or/and Vaadin), I’d guess it could become even smaller.

Are these setups actually good for anything?

Well, that depends on what you are doing. If you really only need Java and a good looking Vaadin UI then why not? You can also extend the setup with some small but powerful Java libraries, and still have a tiny deployment artifact compared to a typical server + war file setup.

But if you are doing anything bigger (e.g. throwing in CDI or JPA), I’d suggest to look into modular application servers like Liberty or jar file based modular approaches, namely Spring Boot or WildFly Swarm. In IoT applications, if you can have your stuff attached to the Internet, it is most probably easier to move the actual UI code to a server with decent resources using an MQTT broker, than to waste your energy on server optimization.

Also, when wasting your time ironing out the last bytes of your server+Vaadin setup, you should remember that the application server and the actual web application are just a slice of what is actually needed by the server. The underlaying OS and JVM will grab a major part of the disk and memory requirements. Before doing too much exercises in this area, be sure to check out if there are other sweet spots to lighten up your server setup.

More about Vaadin Font Icons


Using icons is a quick and effective way to visually represent content on the web. Icons can also aesthetically improve a site’s or application’s visual look and feel. Having all the icons in one font file is a very handy way of working with icons in design applications. Font icons being basically vector graphics you can scale them to any size without losing sharpness. By attaching font icons to your front end you can also style their colour, size and even animate them with CSS. So as a web designer or application developer, who wouldn’t love using font icons?

Font Icons are Awesome!

The most famous and used font icon in web design is Font Awesome. Its popularity has however made it a bit too common and even a little bit boring. Vaadin Font Icons is a new and hopefully fresh competitor for Font Awesome. The most notable difference between the two is the icon’s appearance. Font Awesome icons have rounded corners and Vaadin Font Icons favour sharp edged corners. Both icon fonts are low detailed and silhouette symbols go well together with modern flat design. Simplified icons appear clearly even when used as smaller sizes, as shown in the comparison image below.


The smallest recommended Vaadin Font Icons font size is 16 pixels. They are designed for a 16 pixel grid and the crisp render results are acquired by using font sizes by multiples of 16 pixels, such as 16, 32, 48 and 64.

16 pix


As another addition, Vaadin Font Icons also support ligatures. A ligature is a special character that combines multiple characters. For example, if you are using Vaadin Icon Font and type the four letters h,o,m and e to form the word ‘home’. Ligature settings will automatically combine the characters h, o, m and e to a single word “home” which is depicted by the icon glyph for home. Ligatures are an effective way to handle icons in design applications and web design. Ligatures are meaningful words in a single character. Meaningful words work better for search engines and people who use text-to-speech.


Keep in mind, however, that ligatures are not supported in IE 9 and older.

Icon design work process

First you have to have an idea for an icon. The idea is usually the hardest part of icon design. You have to design a simple yet recognizable shape for the item or action. Pen and paper sketches are a good starting point for drawing down different icon ideas. After finishing the icon idea, you need to draw the icon as a vector graphic. You can use vector programs such as: Adobe Illustrator, Bohemian Codings Sketch or Corel Draw. The main thing about vector graphic drawing applications is that you can use multiple artboards and export individual icons as SVG images. Creating vector paths you should avoid making unnecessary paths and keep the vector object as light as possible.

work in progress

After I have all the individual icons in SVG format, I then import the images to the Icomoon web application. I have to say that Icomoon is an outstanding tool for all who want to create their own icon fonts. Icomoon makes font creating fun and you can use it for free. If you want to have more premium features with cloud support, then you have to pay a small fee. If you want to learn more about Icomoon, go to the web site:


The current version 1.0 of Vaadin Font Icons includes 530 unique icons. Vaadin Font Icons are designed for web applications and have been released under Creative Commons license so you can use it free of charge. We are going to add new icons to the collection and continue improving the Vaadin Font Icons site. Download or check out for more information about the Icons at I hope that you like the icons and find them a useful design asset.

Getting started

If you would like to have the Vaadin Font Icons running in your project then you can go to the Vaadin Font Icons site, download the icon files and see more use case examples: You can also have Vaadin Font Icons as a Vaadin add-on!addon/vaadin-icons-add-on

See Vaadin Font Icons