Tragic Tragic Software & Cloud Solutions | San Diego • Seattle Blog
back

What is a Progressive Web App?

Overview

A Progressive Web App (PWA) is a web application that has functionality like a native app. For mobile users, a PWA can be installed on the user’s home screen. Progressive web apps can also access device features, like the camera, GPS, contact book, and calendar.

When a user launches a PWA, it doesn’t launch the web browser. Instead, the app takes up the user’s whole screen, which makes them look and feel like standalone apps. PWAs offer a high-performance, responsive experience by combining the best parts of a web application and native mobile app.

As Google themselves says, PWAs are web applications that follow these three pillars:

  1. Capable: Thanks to adoption by browsers and new APIs, they are reaching feature parity with native applications.
  2. Reliable: PWAs are fast and reliable, regardless of the network. They can even work when the user is offline.
  3. Installable: Progressive web apps that are installed on the user’s device will run in their own window, not in a web browser tab. This makes them feel more like native apps.

Benefits of a Progressive Web App

Progressive Web Apps are a great way to launch a product without overinvesting resources. In particular, you can release a PWA to the public quickly and start to get their feedback. To many users, your app will feel like a website. And to those who download the app on their mobile device, they will gain access to more native features.

Whether you’re a small startup or an enterprise, there is value in considering building and supporting a PWA – instead of several native apps. Many companies, from Twitter and Pinterest to Uber and Starbucks, are adopting this technology and seeing great results.

Your Competitive Advantage is Waiting

Learn how progressive web apps and other tech can help your business reach new heights. Schedule your free consultation today.

Who Should Be Building One?

PWAs are a great option for startups trying to release their minimum viable product (MVP). You can build and support a single codebase that works across a variety of platforms and operating systems. Better yet, as long as the user’s device has a modern web browser, your app is supported! There is no additional work required.

In addition, mid-market and enterprise firms can benefit from the technology. Building a progressive web app lets them test the waters with a new product or service. If the initial response is strong, then they can dedicate more resources to the project to extend the PWA into a JavaScript native app or build a native app.

In our experience, people are afraid of PWAs due to some outdated thinking. A modern progressive web app has plenty of native features, including access to a device’s camera, GPS, calendar, documents, and more.

Unless you are at the absolute cutting edge, your use case is likely supported by PWAs.

Building a Progressive Web App

Building a PWA can be simple. This is because you can extend your existing web application into a progressive web app. A PWA leverages a core piece of JavaScript functionality called service workers. Service workers are JavaScript files that run outside of the main browser thread, and are able to intercept and cache network responses. To turn your web app into a PWA all you need to do is:

  1. Create a Web App Manifest: This JSON file tells the browser that your app is a PWA and gives it some basic information about how to display the app and icon.
  2. Enable Service Workers: These JavaScript workers give PWAs their app-like capabilities, including the ability to work offline and display push notifications.

It is also highly suggested that you create an Application Shell. This is the wrapping HTML for your application which can be easily cached and displayed even when there is no internet connection. This creates a more app-like experience for users with low connectivity or that are offline.

There are some challenges to thinking mobile first. Instead, we suggest companies think about their usage patterns and business model. If you generate revenue from mobile, then you should invest in mobile.

However, if you generate revenue from desktop, then you should explore building a fully responsive web experience. A properly designed and built progressive web app would be able to give you the best of both worlds – a fully featured web experience and a paired down mobile app all in one.

At Tragic, we have been advocates of this technology for a long time. In 2017, we created a white paper explaining this new technology for non-technical leaders. We wrote articles explaining this budding technology and outlining why it was the way of the future.

We followed the new technology closely, writing about the state of growth of the technology the following year. In particular: "We are optimistic on the future of PWAs because of the benefits they provide to all businesses, even those not traditionally classified as technology companies."

Conclusion

PWAs bring lots of benefits and are powerful tools that every development team should have in their toolkits. Native applications can be expensive, particularly for those companies looking to support a native iOS app (Swift) and native Android app (Java).

Thankfully, the advances of progressive web apps create another viable option – extending your website to have features that mimic a native app. As we mentioned above, there has been a big push in recent years to start with “mobile-first design” and “mobile-first development”.

We think this is a mistake.

You should be where your users are. And, increasingly, users are on multiple platforms (Windows, Mac, iOS, Android) and devices (smartphone, tablet, laptop, desktop). Organizations need to begin to create holistic multi-platform solutions, so that your users have consistent experiences, and so your resources are used as efficiently as possible.

We have built and shipped progressive web apps for clients with great results. With features offline access, push notifications, native device functionality, and more, PWAs are here to stay.

#further_reading