What is Progressive Web Apps?

Published on 2017-01-26

There have been a lot of buzz lately around Progressive Web Apps (PWA) - but what is a PWA and what does this all mean?

Is PWA the road ahead to fix application development and close the gap between web and native?

Native apps

Native apps are developed in programming languages and environments that fit their deployment target. Traditionally that means that Android apps are made with Android Studio and written in Java while iOS apps are written made with XCode and written in Objective-C/Swift - there are similar defaults for all platforms, Windows, macOS, Linux eg. - although they are not as strictly focused as the mobile platforms.

Native apps normally use the UI and design principels of their target platform and can do things like utilize push notifications, function while offline, store data locally etc.

Web apps

Web applications - in contrast to native apps - run in the browser. This means to use the web app the user must navigate to it in the browser.

When the web app operates it must do it inside the restrictions of the browser - that usually means staying within the broders of the browser sandbox and generally having very few options for behaving in ways that could in any way be seens as annoying the user. Browsers where made for viewing static content on the web and these limitations are put in place for a good (and historical) reason!

Progressive Web Apps?

This is where progressive web apps enter the field!

PWAs are actually just a way to describe an ever changing collection of new browser APIs and the way they are used to deliver native-like experiences using web apps.

PWA Core tech

At the vore of PWAs we find the service worker.

Service workers are basically scripts that the web app can register to respond to certain events. Along with this some new and useful APIs have been added - like utilizing local storage and delivering push notifications.

It is possible to implement a service worker that caches request responses and serve the cached values if the network is unavailable or just slow. It is also possible to have service workers give push notifications upon incomming push messages and let the user interact with those notifications to perform tasks in the app.

Furthermore PWAs can be pinned on mobile platforms to look like regular apps and they can (should) include a manifest to specify how the app is cached for offline use.

Check out the service worker examples by Google and the fantastic cookbook with examples at Mozilla.

PWA Pros/cons

As with all (new) tech there are some advantages and disadvantages from choosing this route. I'll try and list some of the most obvious here.

Pro:

  • No app store/download - delivered through the web directly to the user
  • No upgrade process
  • Easy for the user to try out
  • Linking to other things and deep linking in the app works cross platform

Cons:

  • Some native features might be unavailable
  • Has to work in the browser - heavy computation eg. might be bad
  • Supported differently on different OS and Browser combinations

Conclusion

I'm very positive about PWA - and I am certainly going to try out some of these techniques!

I think we owe ourselves (as developers) to maybe think outside the box and consider PWA a viable alternative when kicking off new projects.

For further reading I refer to the PWA website at Google.