Progressive Web Applications: How to Use Them in 2020

1. Progressive Web Applications Are Installable
2. Progressive Web Applications are Easier to Host
3. Progressive Web Applications are Packed with Native features
4. Progressive Web Applications are Cheaper to Maintain
5. Popular Progressive Web Apps and Trends
6. Getting Started
7. Conclusion

In today’s fast-paced tech world, it can be difficult to distinguish between growing trends and quick fads. Progressive Web Applications have been around for a while now but have recently gained more momentum, and this trend is unlikely to die out any time soon. A progressive web application is any application made on the web that meets three simple requirements:

With these elements, your web application is ready to meet and exceed the capabilities of several native applications, with new features made available every time a major browser is updated.

Progressive Web Applications Are Installable

Just by meeting the three requirements mentioned above, any user that lands on your application in their browser will be prompted to install it on their device. This means access to a user’s home screen without ever having to search for, download, and install your application from an app store that may or may not charge your native application just to be listed there. It also means that your application can run on any device with a major browser installed.

Progressive Web Applications are Easier to Host

Competing for attention in an app store is challenging and risky, as studies have shown that native app downloads are approaching their lowest levels. Additionally, the web app model ensures that installation doesn’t include a large downloadable bundle to run your app. With a progressive web application, users with limited access to a high-speed internet connection can still download and interact with your content, thanks to the myriad of features made available by using a service worker.

Progressive Web Applications are Packed with Native features

A service worker allows your progressive web application to interact with features that have previously only been available to native applications. This includes push notifications, offline usage and advanced caching capabilities, background syncing, automatic updating, and so much more.

With a web app manifest file, you can determine key interaction specifics for users who add your progressive web app to their home screen, including:

• A start URL
• Browser UI customizations
• Default device orientation
• Whether or not to show the URL bar
• An icon and short name for the application when a user installs it.

Progressive Web Applications are Cheaper to Maintain

Finally, since a web application is just a bundle of HTML, CSS, and Javascript, in addition to the three primary requirements, they require fewer resources to build and maintain. This means that separate teams are not needed in order to write different code that translates to the same UI and capabilities for different devices.

To learn more about the advantages of progressive web applications, take a look at the MDN overview here.

Popular Progressive Web Apps and Trends

Twitter and Instagram have both released progressive web apps alongside their native applications. In doing so, many users have switched to the web app versions, citing speed and ease of use as their primary motivations. Flipkart, India’s largest e-commerce site, has also made this switch, noting that the change led to users tripling the amount of time spent on their site. Since 2015, several large companies have released progressive web applications and have found this strategy to consistently increase page loading speed, time to interactivity, conversion, and discoverability. The progressive web app framework has even proved to be a valuable model for releasing ebooks, as shown by Jeremy Keith’s “Resilient Web Design”.

PWA Stats lists several other companies that have launched progressive web applications, including Treebo, Tinder, Uber, Pinterest, and Forbes. All of these companies have released case studies noting decreased page load time, increased session length, higher ad click-through rates (where applicable), and increased product engagement.

Getting Started

If you already have a web application, adding progressive capabilities is as simple as including HTTPS support, a service worker, and a manifest.json file. You can look at a few simple examples to see additional capabilities, such as offline support and serverless file creation and downloading. There are plenty of other features and capabilities that can be added, with several more coming in the near future. Achieving feature parity with a native application can seem challenging, but there are plenty of resources geared towards making this easier, and the result has been proven to consistently increase valuable user metrics.

Conclusion

If you have a native application without a web counterpart, consider adding a progressive web application alongside your current native strategy. The web platform is continuing to add new features in order to compete with native development, and the benefits are clear and measurable. Progressive web applications are faster, more resilient, available to a wider audience, and easier to maintain than native solutions.

Additionally, progressive web applications don’t require an app store or updates whenever new device software versions are released. Maintaining progressive web applications costs less than maintaining native applications. Aside from app store costs, progressive web apps only require a team with a background in web development, as opposed to native applications requiring specialized teams for every platform intended to serve the application.

Progressive web applications are favored by users and the companies that build them. They are the right choice for almost any product, and will quickly increase the reach and usability of your app while decreasing overall costs.