Using in Progressive Web Applications
The Kendo UI for Angular components are fully compatible with Angular Service Workers and enable you to create Progressive Web Applications.
Overview
Progressive Web Applications (PWAs) help you create applications for web and mobile platforms that can work offline and can be accessed outside the browser on supported mobile devices.
PWAs blur the line between web and traditional native applications and leverage a number of key technologies:
- Service Workers—Allow the application to take control of the network and to function offline.
- Application Manifest—Allows the user to pin the application to the Home screen.
The Progressive Web App Checklist lists all important requirements for Progressive web applications.
Evaluating PWAs
Google's Lighthouse tool generates a report which focuses on five major fields—performance, Progressive Web Application, accessibility, best practices, and search engine optimization (SEO). These indicators demonstrate the strengths and weaknesses of the application and allow for determining areas for improvement.
Sample Project
This sample project is based on the Angular Service Worker support for CLI projects. For a working example on PWAs with a Lighthouse score of 90+, refer to the kendo-angular-pwa repository on GitHub.
- Create a template CLI project with a default
ngsw-config.json
configuration file for the service worker by runningng new my-project --service-worker
. You can further modifyngsw-config.json
by applying a custom service worker configuration. - (Optional) Create a
manifest.json
file.manifest.json
instructs the application device how to display the application on its home screen. For more information on setting up and configuringmanifest.json
, refer to the article about the web app manifest.