github vaadin/flow 24.1.0
Vaadin Flow 24.1.0
on GitHub

latest releases: 24.4.0.alpha30, 24.4.0.alpha29, 24.4.0.alpha28...
10 months ago

Changes since 24.0.8

All changes

This is a Flow 24.1.0 GA release for Vaadin 24.1.

Flow 24.1 is based on Jakarta EE 10 / Servlet 6.0 specifications, uses Spring Framework 6 / Spring-boot 3 and requires JDK 17+.

Breaking changes

  • Bump pnpm version to a supported versions (8.3.1)
    Commit · Pull request

    pnpm 8 dropped node 14 support which has no impact on Flow. There are changes to the lockfile and local store format but pnpm should upgrade or redownload as needed. pnpm 8.3.1 also works with Node 20

  • Remove fallback chunk
    Commit · Pull request · Issue

    The fallback chunk contained all JavaScript and CSS for classes which cannot be reached from an entry point (route or exported web component). By removing it we improve performance as we do not need to scan all classes, only the reachable ones. We also fix issues with the license checker as it did not really know how to behave with commercial components that may or may not be used. The drawback of removing the fallback chunk is that if you are using a component which is not reachable, as determined by the scanner, then your JS/CSS for the component will be missing. The typical case for this is having a factory that can create components using reflection. The scanner is not able to find the referenced classes as they only appear as a string in the source code. For this case, you need to add @Uses(SomeComponent.class) to the factory, for each component it can create using reflection. To be able to detect unreachable components in development mode, you should set the devmode.optimizeBundle property to true.

  • Move generated Flow files into frontend/generated/flow
    Commit · Pull request

    Removes the need for importing from the target folder and simplifies when all generated frontend files are in the same folder.

  • Upgrade to TypeScript 5.0.2
    Commit · Pull request

  • Remove compatibility mode from API
    Commit · Pull request

New features

  • Pre-compiled production bundle
    The pre-compiled production bundle can be used to not have to run front-end tools like npm and Vite if no add-ons or front-end files are used in the application. Flow builds a new production bundle once it decides that pre-compiled bundle can't be used because of front-end customisations.
    Read more about pre-compiled production bundle in Building for Production docs.
    To be able to build a new production bundle, one can set vaadin.force.production.build config parameter, e.g. when you want to lazy load the components to the browser or you experience an issues with pre-compiled bundle:

    • System property -Dvaadin.force.production.build=true
    • Configure vaadin-maven-plugin: 
      <plugin>
     <groupId>com.vaadin</groupId>
     <artifactId>vaadin-maven-plugin</artifactId>
     <executions>
         <execution>
              <goals>
                   <goal>build-frontend</goal>
              </goals>
         </execution>
      </executions>
     <configuration>
          <forceProductionBuild>true</forceProductionBuild>
     </configuration>
  </plugin>

    Includes the following feature commits:

    • Use default prod bundle if possible
      Commit · Pull request · Issues [16627]. (#16627), 16671

      Re-uses re-bundle checker in production mode. Copies default bundle files from JAR to application's resource folder in target and skips re-bundling or executes usual frontend build codes if it sees any customisations. Uses class finder to look for frontend resources from flow plugin.

    • Task to clean generated frontend files
      Commit · Pull request · Issue

      When automatically generating a new frontend bundle clean any frontend files generated specifically for bundle generation. For production vite execution is not a task. Running pnpm will delete package-lock.json and running npm will remove package-lock.yaml

    • Store and use package-lock for bundle
      Commit · Pull request · Issue

      When making a bundle build if no package-lock file exists in project, use the dev bundle package-lock that is stored when a dev bundle is built. Acceptance order of lock files is: project lock, src/dev-bundle, jar bundle. Use constant in file name

    • Enable custom theme for pre-compiled prod bundle
      Commit · Pull request

    • Add usage statistics for pre-compiled production bundle
      Commit · Pull request

    • Add parameter to force prod build
      Commit · Pull request

      Add a parameter that forces a production bundle build even when an applicable bundle exists.

    • Add license check for production bundle
      Commit · Pull request

      Collect pro-components from stats.json which are used in the project and check license for those. Closes #16720

    • Make "" and "login" eager and the rest lazy by default
      Commit · Pull request

    • Clean app devBundle with clean-frontend (#16914)
      Commit · Pull request

      When running the clean-frontend target remove also application dev bundle from the project. Part of #16888

  • Production bundle loading optimisations
    The production bundle can be optimised to use lazy loading of components (on demand, once the route/page is opened) by forcing a build of the production bundle. With the pre-compiled production bundle all components are loaded eagerly apart from the heavy components Map, Charts, Spreadsheet and RichTextEditor.

    Includes the following feature commits:

    • Support lazy loading of route dependencies
      Commit · Pull request

      Adds a @LoadDependenciesOnStartup annotation you can set on your AppShellConfigurator class to define for which routes the dependencies should be loaded eagerly when the application is first visited, e.g. @LoadDependenciesOnStartup(MyMainView.class) Defining only @LoadDependenciesOnStartup causes all dependencies to be loaded eagerly Not defining any @LoadDependenciesOnStartup annotation uses the Flow default, which currently is to load everything eagerly but is bound to be changed to load "" and "login" routes, if defined, eagerly and dependencies for the remaining views on demand. Also adds a @DependencyTrigger that overrides which class triggers loading of the dependencies for a route not loaded on startup. It is meant to be used internally to create the default production bundle. It is not meant for any other usage.

    • Include bundle size visualisation for production build
      Commit · Pull request

      This is mostly useful for applications generated on start.spring.io. Different messages are shown for Flow and Hilla applications. Nothing changes in production and for applications already having some routes.

    • Require production bundle for annotation
      Commit · Pull request

      If the LoadDependenciesOnStartup annotation is added a production bundle should always be built.

  • Hot Module Reload
    Allows to modify a custom theme CSS files and see the results immediately in the browser without page refresh.
    This includes the following features:

    • HMR for changing styles injected into shadow roots
      Commit · Pull request

    • HMR for theme styles.css in bundle mode
      Commit · Pull request

      Rewrites and inlines CSS imports so that changes to imported CSS files are also taken into account.

    • Watch all active themes when in dev bundle mode
      Commit · Pull request

      Allows HMR to work also for themes in the jar-resources, if somebody updates them e.g. using a file watcher.

    • Enable Vite HMR for theme styles
      Commit · Pull request

      At the moment only works when you do not inject the theme into shadow roots When changing component themes, a full reload is always needed because of how the theme injection is implemented in the components.

  • Show a more helpful page when opening an application without routes
    Commit · Pull request · Issue

  • Deprecate Label and add NativeLabel as replacement
    Commit · Pull request · Issues 4384, 3532

    Adds NativeLabel as direct replacement for the HTML-based Label component / element.

  • Watch for theme changes in other Maven modules
    Commit · Pull request

  • Automatically use jar resource listener in a multi-module Maven project
    Commit · Pull request

  • Allow listening to additional jar-resources folders
    Commit · Pull request

    This enables listening to src/main/resources/META-INF in another module in a multi module project so that live reload works for frontend resources Usage: vaadin.frontend.hotdeploy.dependencies=../relative-path-to-module-with-frontend-resources, ../possibly-another-module in application.properties or as a system property

  • Added single and double click event listeners registration methods
    Commit · Pull request · Issue

    This change adds addSingleClickListener and addDoubleClickListener methods to the ClickNotifier interface to simplify the creation of specific listeners for click and double click events.

  • More eager cleanup for UIs using Beacon API
    Commit · Pull request

    Notifies server about closed UIs using a beacon request on pagehide event. At the same time unifies behaviour in certain edge cases, where Safari maintained the state when brought back from page cache. Previously Safari in some situations kept the state. Tested manually with Safari, Chrome, Firefox and validated results using VisualVM. Closes #6293

  • Add feature flag for the SideNav component
    Commit · Pull request

  • Warn about JavaScript that is not found in production
    Commit · Pull request

    If you at runtime use a component with @JsModule that refers to a url that was not included in the bundle even though it should have, this prints a warning like "The component class com.vaadin.flow.component.notification.Notification includes '@vaadin/notification/src/vaadin-notification.js' but this file was not included when creating the production bundle. The component will not work properly. Check that you have a reference to the component and that you are not using it only through reflection. If needed add a @Uses(Notification.class) where it is used."

  • Enable skipping dev bundle rebuild
    Commit · Pull request

    Make it possible to skip checks for devBundle rebuild. Closes #16037

  • Make AtPush inherited
    Commit · Pull request · Issue

    Allows you to use a super class for configuration.

  • Add LocalDateTimeToInstantConverter (#16415)
    Commit · Pull request

    Adding LocalDateTimeToInstantConverter: There already is a LocalDateTimeToDateConverter but Instant is a newer, better replacement. Since your Converter already relies on Instant to calculate the Date I would appreciate it, if Instant is also supported. Tests and proper formatting were also added.

  • Load theme using Vite
    Commit · Pull request

    This changes theme loading so that theme CSS files are imported using import 'theme/mytheme/styles.css'; Using this instead of import someCss from 'theme/mytheme/styles.css?inline'; // inject the css somehow into the DOM allows the default hot replace functionality of Vite to be used. Note that a followup PR is still needed to actually enable hot replace because the styles are still also loaded for shadow root injection, which currently prevents hot replace from being used. In production mode, Vite will now bundle the theme styles.css and put it in VAADIN/build/indexcss-something.css, which means that URLs that refer to files in src/main/webapp or similar need to be rewritten to use ../.. which cancel out VAADIN/build. Paths inside packaged themes also need to be rewritten the same way.

  • Adds helper methods for commonly used CSS properties
    Commit · Pull request

    The current Style API is basically a wrapper for a string-string map. These helper methods make finding the correct property value easier for Java users and prevents making typos in the property names.

  • Support ES-module applications
    Commit · Pull request

  • Enable running npm ci mode (#15579)
    Commit · Pull request · Issue

    Adds possibility to install the npm packages using npm ci instead of npm install (or for pnpm: pnpm install --frozen-lockfile) to install the exact versions in the lock file. Can be enabled with -Dvaadin.ci.build=true system property (or <ciBuild>true</ciBuild> config parameter of Vaadin Maven/Gradle plugin) when executing a production mode frontend build.

  • Add aria-labelledby API to HasAriaLabel
    Commit · Pull request

Fixes

Check out latest releases or
releases around vaadin/flow 24.1.0

Don't miss a new flow release

NewReleases is sending notifications on new releases.

Get notifications