Progressive Web Apps (PWA)

What is a Progressive Web App?

In order to answer this question, let’s first take a moment to look at the different app formats that exist. There are the normal apps that you can download as a smartphone user in the App Store. These are called native apps because they were the first of their kind and they are written in the programming language specified by the operating system manufacturer. For Apple this is Swift, for Android Java is used. There are also hybrid apps that look like native apps, but are built with the help of modern web technologies such as JavaScript and CSS, and thus run independently of the operating system on any device. And, there are web apps that are launched from the browser – they look like a classic desktop application, and they have various interactive features.

Progressive web apps are the latest in development and work similar to hybrid apps. However, PWAs can be installed directly from a website and are available after installation in a reserved web container of the mobile device. They run like a website or a web app with the help of web technologies, but look more like an app to the user. Why? Because they have native functions such as push notifications, GPS or the camera can be accessed, and because you can add their icon to the home screen like a normal app. Unlike native and hybrid apps, progressive web apps do not need to be downloaded from the App Store. In simple terms, we can say:

A progressive web app (PWA, for short) is a website that has the functions of an app.

How do Progressive Web Apps work?

Progressive Web Apps are run with the help of web technologies inside of a web container that is stored on a mobile device. They can be launched like a normal mobile app. PWAs are installed through an installation routine which is usually executed via the corresponding website.

PWAs are created using web technologies such as HTML, CSS and JavaScript. Open Source applications such as ReactJS or Ioniccan be used free of charge. These are frontend frameworks in which certain elements of the graphical user interface are already set up.

It is also possible to convert existing websites to PWAs. Tools such as the PWABuilder from Microsoft help with this. A website built with WordPress can be converted into a PWA using plugins such as “Super Progressive Web Apps”, “PWA” or PWA for WP & AMP.

What are the differences between Progressive Web Apps and other technologies?

• Websites:

Progressive Web Apps run in the browser like a normal website, but do not require an internet connection after the first installation.. Unlike normal websites, Progressive Web Apps can control the native functions of the mobile device (for example, push notifications, camera or GPS) and thus enable more interactions.

• Web Apps:

Unlike web apps, Progressive Web Apps can also be used offline. It is also possible to offer Progressive Web Apps in the App Store. This is not possible with web apps.

• Hybrid Apps:

A hybrid app is opened in a browser-like container, but in terms of usability, it acts like a normal (native) app. A Progressive Web App can also be accessed through such a web container and can be used like a native app, but, in addition, you can access PWAs in the same way that you would a website. While hybrid apps are only available through app stores, PWAs can be downloaded independently, as well.

And what does PWA have in common with these three formats?

All four formats are connected by the fact that they are browser-based and therefore work platform-independent. While developing a native app always requires at least two versions (one for Android and one for iOS), web apps, hybrid apps and progressive web apps require only one application.

What are the advantages of a Progressive Web App?

Progressive Web Apps have many advantages – which we are going to summarize here. When making the comparison to native apps, the main advantage is that you can develop and maintain Progressive Web Apps quickly and cost-effectively – you don’t need two versions for different devices. A PWA is executed via the browser and thus works independently of the platform.

Unlike a website and a web app, you don’t have to be online to use a PWA. Once downloaded and installed, you can use it offline.

In addition, Progressive Web Apps allow more interactivity compared to websites and can access the native functions of the phone (such as push messages, camera or GPS). In contrast to many native apps, Progressive Web Apps require significantly less storage space (often only a few hundred KB compared to several MB) and impress with reduced loading time when compared to websites. This makes it possible for your customers to surf fast and to interact faster, without any wait time – even videos and animations don’t disrupt smooth scrolling.

The fact that there is no need to make Progressive Web Apps available in app stores offers the advantage of saving time and costs associated with registering an app with the Apple, Google and other distribution platforms: You are free of the terms of the app stores, don’t have to wait until an app has been officially reviewed and approved and you can bypass the commission payments that are incurred for apps and in-app purchases.

But, you can offer a PWA there if you want. There are good reasons for that too. Customers are used to searching for apps in app stores. If you, yourself, want to use this form of outreach, then you should definitely offer your Progressive Web Apps in the Apple App Store, Google Play Store and/or Microsoft Store as a hybrid app.

All advantages of Progressive Web Apps at a glance:

• browser-based
• platform-independent
• expansive reach
• fast development
• easy to optimize
• cost-effective
• low storage requirements
• reduced loading time