Docs

You are viewing documentation for an older Vaadin version. View latest documentation

Docs

Introduction

Progressive Web Applications (PWAs) combine new technologies with established best practices. They allow you to create reliable, accessible, and engaging experiences that give users a native-like experience, with a user friendly opt-in installation flow.

Note
 This documentation covers how to create PWAs with Vaadin. For detailed generic PWA information, see the Vaadin PWA Handbook.

Basic PWA Concepts

All PWAs have the following common basic features that enable native-app-like behavior:

  • Web App Manifest: This provides information about an application, for example its name, theme, icon, and description. These details are needed to make an installable version of web application.

  • Service Worker: This is a type of web worker. Essentially, it is a a JavaScript file that:

    • Runs separately from the main browser thread.

    • Intercepts network requests.

    • Caches and retrieves resources from the cache.

    • Delivers Push messages.

The ability to intercept network requests, makes it possible to serve files directly from cache and create a full application experience, even when no network is available.

Application Installation Requirements

To support installation on devices, the following additional features are required. These depend on the device and browser used:

  • Icons: Different icon sizes are needed to support different devices. To enhance the experience, splash screen images are also required.

  • Offline support: The service worker must be able respond to serve the client if a network is not available.

  • Header information: The application must include browser and/or device-specific theming and icon data in the header. This is in addition to the manifest file,

  • Installation prompts: Special handling information is required for Google Chrome.

    Note
    		 PWA installation prompts are a feature only available for Chromium-based browsers. This feature is being phased out in later version of Vaadin in favor of a more universal user experience.
Note
 Many new browser features, including those required for PWAs, require HTTPS. Even if your PWA currently works without HTTPS in some environments (for example, Android), this is likely to change and it is probable that PWAs that do not support HTTPs will malfunction in the future.

A34826B4-4856-4B6F-9A72-769EE76CC09F