Lightning Talk: Progressive Web Apps

von Merle Ehm (Kommentare: 0)

The short lightning talk intruduces the fundamentals of so called Progressive Web Apps. These kind of web apps are simple web pages with special characteristics. A real Progressive Web App loads fast and is even accessible on lost connectivity. It feels like a native app.

The technical keypoints are the use of a caching mechanism (Service Worker) and the definition of an app manifest file which makes it possible to install the web page at the home screen on a mobile device.

The talk uses the website of the PREACT project (https://www.preactjs.com) to demonstrate the key features, because this site was build as a Progressive Web App. It responds very quickly to user interactions and loads very fast.

A look into the Chrome Developer Tools visualizes the cached content of the website. The whole content of the website seems to be completly in the cache.

The Chrome Developer Tools also shows up the content of the App Manifest. It defines an app icon and a splash screen file.

If the website is visited for the second time by the same mobile device, the Mobile Chrome proposes to add the website on the home screen. Launching the website using the app icon on the home screen will display the site in fullscreen mode.

Because Progressive Web Apps are invented by Google, they only work on Android devices as described. But with some efforts it is possible to get nearly the same behaviour on an iOS device. Read more about it in Progressive Web Apps on iOS.

At the end of the talk we discussed amongst others about the relevance of the Google Play Store. The daily look into the store for new apps is meanwhile gone. Every user has already a set of required apps installed on the device. Therefore it wouldn’t be necessary to publish a new created app into the store. Rather a Progressive Web App will be more accessible via the web than via the Google Play Store.

Do you want to build a Progressive Web App by yourself? A Chrome extension called Lighthouse can help you to check your project for Progressive Web App criterias.

Zurück