As you’ve found your way to this blog post you’ve probably heard the term PWA somewhere. Good for you – PWAs are what the year 2018 will be remembered for, so you are right on the bleeding edge. How exciting! In this blog post, I explain what does the term actually mean and why you should care about it.
(source: Google Developer site)
What is a PWA?
PWA stands for Progressive Web Application. Let’s examine it by splitting it into two parts. The latter two words (“Web Application”) speak for themselves. PWAs are web applications. Here, web application simply means an app running as a website like, for example, Twitter. The first part of the term – Progressive – means that the user experience is enhanced gradually based on the browser’s capabilities. Essentially this means that the web application works well in older browsers but can utilise newer technologies to enhance the experience if the user is using a browser supporting them. Sounds simple, right? So where is the term from?
Progressive means that the user experience is enhanced gradually based on the browser’s capabilities
The term was introduced by Google Chrome engineer Alex Russell in his blog post in 2015. Since then, Google has been promoting their usage actively and provided a lot of resources on the topic such as a site explaining them in more detail.
While giving presentations around PWAs I always encounter the same confusion at this point. “So… Is it a technology? Is it a standard? Is it something owned/patented by Google?” No, none of those. It is simply a term to describe a specific way to design and build applications. Next, let’s try to understand what they are by going through the characteristics.
Here are the original 9 characteristics of PWA by Alex Russell with an explanation as to what they mean in this context:
- Responsive: Page looks good on different screen sizes (e.g. phone, tablet, desktop)
- Connectivity independent: Function without Internet connection
- App-like-interactions: Look’n’feel of native application
- Fresh: Always up-to-date
- Safe: Utilise secure connection to mitigate multiple types of security threats
- Discoverable: Browsers identify PWAs automatically
- Re-engageable: Can bring users back to the app using, for example, Push Notifications
- Installable: Can be stored to the home screen just like native apps but without the extra hassle of the App Store
- Linkable: Can be shared around as plain URLs
For the reader of this blog post the most important functionalities are:
- Installability to the home screen
- Access to multiple native APIs such as camera, geolocation, vibration, payments etc.
- Support for Push Notifications
- Offline usage
- Full screen and splash screen support
(source: Alex Russell’s blog post)
To conclude all of the above, PWAs can do most of the stuff native apps can do and the gap between what native and web apps can do is getting narrower all the time.
Why Now?
By now you might be thinking that all this sounds so good that there must be a catch since the PWAs aren’t the default way of implementing applications. Yes, you are right. There is a catch. There has been a lack of support for the technologies empowering PWAs in some environments. Android support has been around for a while, starting from Android 5 which means that over 80% (source: Google’s Android statistics) of the Android devices worldwide support the technologies needed to implement PWAs. The adoption is even greater if you only consider Europe or North America. So the Android support is really good already.
Unfortunately, the other key player sharing the market in mobile phones hasn’t been too eager to implement the technologies (read why). The iOS support has been missing, thus preventing the wider adoption of PWAs. But as of the soon upcoming iOS 11.3, the support will be available also for iOS. Luckily the adoption of new iOS versions is relatively fast so a high level of support can be assumed to be available later this year. For reference, versions 10 and 11 represent 93% of all iOS versions used out there according to Apple.
While the focus when talking about PWAs is often in the mobile environment, they do work for desktop as well. Earlier this month there was an important announcement by Microsoft stating that PWAs are now supported by Edge and Windows 10. Chrome and Firefox are supporting PWAs already and so will the next release of desktop Safari.
Looking for a change in scenery? We are hiring!
Example: Twitter Lite
The most famous example of PWAs is the Twitter’s PWA version called Twitter Lite (try it with Android or desktop at mobile.twitter.com). Twitter has also published their reasoning behind building the PWA version. To highlight some of the facts from the post, compared to their native app, the size of the PWA version is only 1-3% and the average load time is 30% less.
Other well-known examples of PWAs include Forbes, Trivago, Washington Post, Telegram, Alibaba and most recently Google Maps Go. There is also a directory of PWAs available.
Conclusions
The year 2018 is expected to be the year for PWAs. The tooling is already at a great level and more and more PWAs are popping up all the time. Once support in iOS is highly available, PWAs become a realistic option for native apps. In case you are considering whether PWAs are the right choice for you, check back soon as I will write a guide on Should I do a PWA instead of a native app?
Gofore already has experience on PWAs and also possesses wide experience in building responsive, great-looking, offline-first and efficient web apps. Whether you need help with architectural choices, design or implementation of PWAs, don’t hesitate to contact us.
FURTHER READING FROM THE GOFORE BLOG
Agile Transformation in Action – Part 1
Agile Transformation in Action – Part 2
What’s the point scaling Agile
