For the past few years, probably since it showed up as a testable metric in Google’s Lighthouse tool, we’ve followed the necessary steps to ensure our websites (big or small) meet the criteria of a Progressive Web Application (PWA).
So long as you’re implementing a simple offline page rather than attempting to make an entire website available offline, I’ve found creating a PWA is fairly straight-forward, as once created, your basic service worker is transferable from project to project with minimal editing.
Once you have your offline page, creating a PWA is mostly a case of generating the correct icons and a manifest file which realfavicongenerator.net currently produces the bulk of.
Having done this for a number of projects it was only recently that we were approached by a client asking if it were possible to submit PWAs to the different App Stores. Having not attempted this before I set about doing some research.
While Apple doesn’t explicitly say PWAs can’t be submitted to their App Store their Review Guidelines suggest that an informational/marketing site like ours lacks anything “app-like” to pass their review guidelines:
Your app should include features, content, and UI that elevate it beyond a repackaged website. If your app is not particularly useful, unique, or “app-like,” it doesn’t belong on the App Store.
The web seems to be conflicted on what’s possible when it comes to PWA’s on the App Store. Given Apple has been sluggish at adopting new web technologies, especially PWAs, it’s unsurprising that they may not yet have fully embraced PWAs. Without more consensus on if it’s possible and how best to go about it, I decided to file this one under “try again later”.
Finding articles that guide you through submitting a PWA to Google Play is far easier. With Chrome supporting Trusted Web Activity and Custom Tabs it’s possible to package up your PWA and submit your app through their Play Console.
When initially beginning this project, I found the following articles, but they’re a little outdated.
Both rely on you getting to know Android App Studio and unfortunately resulted in an app that crashed for some users. While that’s not likely the fault of these articles, they didn’t provide the results we were looking for.
It was only when starting to writing this blog post that I discovered there are other, far easier means of packaging your PWA into an app. So, I paused writing and tried again using Bubblewrap. I chose this over PWABuilder but as this is simply a graphical interface for Bubblewrap, I’d expect both to work just as well.
What both of these do is take Android App Studio completely out of the equation (though you can use it to tweak the code Bubblewrap outputs) making the entire process far quicker, easier for novices and really the big benefit for us was it solved our app crashing issue.
The result is a fully fledged Bronco PWA installable from Google Play, and you can download it here.
Yes, as far as we know. As this project was a proof of concept and our PWA has a limited audience I don’t have statistics on how many devices successfully support the app, but I do know that on some devices where we experienced crashes initially, we now no longer see that happening.
It’s proven to be an interesting project to tackle, and would certainly have been far easier if I’d found Bubblewrap initially, but in case you’re considering doing the same here’s a few of the issues I came across along the way:
When using Android App Studio (and following the initial guides like those on CSS Tricks) our PWA would crash displaying the error “Install Chrome 72 or higher”. As errors go it’s pretty unambiguous, that is until you find that the device crashing is one of the latest Google Pixel devices, running the latest version of Android and the latest version of Chrome.
Trusted Web Activities (TWA) was introduced in Chrome 72, which was released in early 2019, and is necessary for our PWA to work. While I expect some devices will exist that don’t support our PWA I’m pretty sure that the device described above isn’t one of them.
The error also appeared when using Android emulators, so wasn’t specific to a single device. With limited Android products available across the team, it was tricky to understand why some devices worked and other didn’t.
Turning to the interwebs provided no resolution, which left me attempting to follow a different process of creating the APK to submit to Google, but the error persisted until I moved to using Bubblewrap.
I’d assume most people who are reading this article won’t be using Android App Studio. With other means available it would be self-castigation to use this to create a PWA if you have no prior experience with it.
While the guides prove a step-by-step process to go through, they only show you so much, and aren’t written with the expectation that the result is an app that crashes some of the time, with an error that doesn’t match reality.
With no experience of using Android Studio, and working in unfamiliar code it’s like asking me to fix a car. Simply because I can drive, fuel and maintain it doesn’t mean that if the brakes fail, you’ll find me rushing to grab a spanner.
Though I managed to squash a few bugs earlier in the process and attempted alternative build processes the result was still a buggy app with no clear route to a solution. Thankfully alternatives exist.
While not exactly a one click submit process both Bubblewrap (a cli process) or PWABuilder (an online service) provide what is likely as close as can be achieved.
One step further would be if Google were to provide this functionality within Google Play Console. Rather than require the upload of a packaged app they could accept a URL for a PWA and create the necessary files as PWABuilder does.
Though it ultimately resulted in a more stable app in comparison to Android App Studio, using Bubblewrap wasn’t error free.
As you’ll see on the Bubblewraps Github page there are a number of issues listed. For us we came across this issue, which thankfully included a suitable and simple fix.
To create a Google App Developer account required paying the princely sum of $25. For a give it a go project the cost isn’t that much to a business or agency.
For freelancers I wouldn’t wish to presume what is affordable, but as a one-off payment I’d say it’s pretty reasonable. The reason to mention it isn’t because it’s a particularly large barrier to entry but because it’s not mentioned in a number of articles I read so may be a surprise cost to some.
The Google Play Console itself I found particularly tricky to get to grips with. Having no background in app development the emphasis put on releases and testing phases was somewhat foreign. I was very much in a work fast mindset and just wanted to get the app uploaded and submitted for review.
To do so required jumping through a few hoops. There’re the obvious bits like having to provide imagery and text that will accompany your app and though questions regarding content for age verification were unexpected, on reflection it made sense that these would be required.
Obviously for bigger apps going through the process of testing internally and releasing to a subset of real users is ideal for ensuring there are no bugs. It took a little time to discover that these weren’t a required part of the process, but eventually I managed to get a better understanding of the process of uploading and submitting an app for review.
If you’re on a tight timeframe then launching a brand-new app might not be for you. While subsequent releases appear to sail through the review process fairly quickly (taking minutes) it was a few days between submitting the first version of the app to having it appear in the app store.
For me this just broke up momentum of trying to get to the point of verifying what was possible, but luckily as a proof of concept we weren’t aiming to meet any big deadline.
When you eventually find a quick, easy process that leads seemingly to an error free app then it probably is worth it. The cost isn’t great and understanding the process is certainly a good thing to learn.
Whether or not a PWA should be available within App Stores? I’m a little on the fence. In some ways I agree with Apple’s view that if the PWA is the same as the website what benefit is there to having an App?
At least that’s the case for smaller website, for larger businesses there’s a requirement that they appear where users are. Even for companies as recognisable as Amazon or Ebay to not have a presence in the various app stores would be harmful to their business. But if PWAs can match the functionality of their app counterpart should these businesses not focus their time on a single codebase rather than multiple different versions?
Like what you’ve read, then why not tell others about it... they might enjoy it too
If you think Bronco has the skills to take your business forward then what are you waiting for?Get in Touch Today!