Aug 21,2019

Shopify API

Everything you need to know about progressive web apps

Everything you need to know about progressive web apps

Tech companies have hailed them as the ultimate answer to the website vs app debate. Big players like Google and Microsoft have thrown their support behind them. And the underlying technology is getting better every day.

Let’s talk about progressive web apps. 

Progressive web apps have been around for a few years now, offering brands a cheaper way to bridge the gap between a mobile website and native app. It looks like an app, behaves like an app and displays offline content like an app – all without the hassle and expense of actually building one. 

But can PWAs ever really compare to traditional mobile apps? Are we ready to ditch the app store and go progressive? Today, we explore all-things PWA, including the pros, cons, and how they match up to their native counterparts. 

What is a progressive web app? 

Put simply, a progressive web app (PWA) is a web application that functions like a desktop or mobile app. The term was coined in 2015, when Alex Russell and Frances Berriman started chatting about the attributes of new web applications over dinner. 

Although the technology for progressive web apps already existed, Alex and Frances were the first ones to package it into a set of best practices. In Alex’s words: 

“These apps aren’t packaged and deployed through stores, they’re just websites that took all the right vitamins… They existed before, but now they have a name.”

Progressive Web Apps: Escaping Tabs Without Losing Our Soul, Alex Russell 

It’s likely that you’ve already come across progressive web apps, and might even have a few installed on your phone. If you’ve ever seen an ‘Add to home screen’ option while browsing a website, that’s an invitation to download a PWA. If you accept, the application installs itself on your phone or desktop – delivering an app-like experience without ever having to visit the app store. 

The idea is to create a user experience so simple and uniform that they can’t tell the difference between a native mobile app and a progressive web app. Big names like Instagram, Pinterest, Forbes, Trivago, Starbucks and Uber are all already utilising the flexibility of PWAs.

The benefits of progressive web apps

Whether they’re used alongside or instead of a native app, progressive apps are becoming more and more popular. Here are some of the reasons brands are investing in PWAs: 

They’re cheaper & easier to develop than a native app

When it comes to developing a native app, one of the main barriers brands face is the time and cost involved with building one. Add to that the fact that you have to develop two separate apps – one for iOS and one for Android – and the whole thing becomes an incredibly expensive endeavour. But with 85% of consumers choosing apps over mobile websites, it’s a technology you can’t afford to explore. 

Enter progressive mobile apps. 

Instead of developing multiple versions of an app for different devices, developers are free to create and publish one progressive web app – leaving it up to the user’s browser to correctly show the app within the screen’s parameters.  

Because building a progressive web app uses the same skillset as building a website, it’s also a lot cheaper to find the development resources. If you have a front-end developer on staff, you might be able to build the whole thing in-house. And without the need to go through the app-store approval process, you can get a PWA out the door much faster than a native app. 

They’re easy to update 

Not only do progressive web apps save you time in the development phase, but they’re also easier to manage going forward. 

Unlike native apps, progressive web apps use the same codebase as your website – which means that you don’t need to update them separately. Your desktop and mobile PWAs will always be up-to-date with your site’s latest content, prices and stock figures. 

Conversely, Android, iOS, PC and Mac apps all need to be updated separately, which makes every update or launch a much more convoluted process. 

They work offline 

One of the most impressive features of progressive web apps is their ability to display content and send push notifications, regardless of whether the user is connected to the internet. 

Thanks to enhanced service workers – JavaScript files that run independently from the web app – PWAs can provide offline access to cached content, just like native apps. 

However, although progressive apps are available offline, they don’t currently search for a network connection and periodically update in the background when they find one – unlike native apps. That being said, Google Chrome is currently testing Periodic Background Sync for PWAs, so this is likely to close the offline usage gap between the two apps. 

They’re fully responsive

To be considered a ‘progressive’ web app by Google, your PWA has to be fully responsive. However, unlike native apps, the work that goes into making your progressive app responsive only needs to be done once – not multiple times for different operating systems. 

Thanks to advanced browser capabilities, all major browsers will automatically display your PWA in a fast, secure, mobile-friendly way – creating an app-like experience without the work of creating several responsive apps.

They’re discoverable in search engines

In another big win for progressive web apps, PWAs show up in search engines just like any other website. This is because, unlike native apps, progressive apps can be indexed and listed in search engines – meaning it’s much better for your SEO. 

They’re installable

Apps keep your brand at the forefront of your customer’s mind – and their home screen. Just like a native app, progressive apps are installable to the home screen through browser prompts, allowing users to download your app without the hassle of an app store.  

They’re linkable

Native apps are specific to their operating system, which means they can’t easily be shared between devices. A progressive web app, on the other hand, can easily be linked to other users through its URL –  reducing the friction involved in customers recommending an app to their friends. 

Progressive web apps vs native apps

When you look at the benefits of progressive web apps, it can feel like there’s no downside to giving native apps the boot. But, unsurprisingly, there are some ways that native apps still have the edge. 

Push notifications 

Although push notifications for progressive apps are supported by the majority of devices, they’re still not compatible with iOS. So, if you want to keep your iPhone and Mac users engaged with your app, you might be better off sticking with a native app for now. 

However, there is a glimmer of hope – iOS recently started supporting service workers for PWAs, so push notifications are likely on the horizon. 

Discoverability in app stores 

Until PWAs become the go-to option for brands and users, you risk a lack of discoverability by not having an app in the app store. There's a certain familiarity with going to an app store and installing an application from there, as opposed to simply adding a site to your home screen. 

As more PWAs for major sites pop up, we'll likely see a gradual shift in this trend – but, for now, visiting the app store is still the default choice for users. 

Why not both?

As seen with brands like Instagram, Twitter and Pinterest, there’s an argument for having both a progressive and a native app – if it’s in the budget. You get all the benefits of a progressive web app – the linkability, search engine indexing, ease of ongoing management – without losing iOS push notifications or app store discoverability. 

However, this won’t be in the budget for most brands. So if developing an app has been something you’ve avoided due to a lack of resources, a progressive web app is a great option. 

P.S. Did you know we develop Shopify PWAs? Get in touch today to find out more. 

Get in touch


You may also like

Ecommerce blogs: 10 easy ways to improve your brand’s blog content
Ecommerce blogs: 10 easy ways to improve your brand’s blog content
Everything you need to know about Shopify Subscriptions
Everything you need to know about Shopify Subscriptions
6 ways to improve customer retention in 2021
6 ways to improve customer retention in 2021