How to download and install progressive web apps through Google Chrome


Progressive Web Apps (PWAs) are, in effect, web apps that can be downloaded and installed from Google Chrome and run like native apps. But learning how to download or install a PWA in Chrome isn’t necessarily the most intuitive process. Even if it’s easy once learned.

Now, PWAs have many advantages. Most of these will be for developers, but it has a ripple effect on users. Importantly, it provides users with offline access to information and web tools. These work like native apps and do so on any platform that Chrome can be installed on.

For example, Google showed how a PWA can replace a basic image compressor and editor with its Squoosh web app. The company built it as a PWA. The tool can therefore be used online or offline. And it works just as the downloaded software should. Users can just as easily access Squoosh on Windows, Mac, Linux, Chromebooks, Android, or iOS.

Of course, it’s not just basic tools like a photo editor that can take the form of a PWA. Google also showcased drawing tools like PWAs, websites, word editors, chat apps, and more.

The possibilities are, in fact, limited only by the imagination of the developers. Thus, the platform has grown significantly since its introduction in 2019. And it will grow thanks to a recent collaboration between Google and Microsoft to make their creation even easier. All of this makes learning how to install a PWA in Chrome more urgent than ever.

To download a PWA in Google Chrome

The “how” when it comes to downloading or installing a PWA through Google Chrome really couldn’t be a much simpler process. In fact, it can easily be summed up in a few steps. And that’s because Google shut down right before launching a pop-up message to let users know that a site can be installed as a PWA.

It goes without saying that there can be differences at any time between the way different operating systems install PWAs. Or whether or not they can be installed. On Android, for example, installing a PWA doesn’t seem to follow the process below at all, at least for now.

This guide will use a Chromebook, but the user interface should also stay the same on Windows, Mac, and Linux – for the Chrome browser. It could potentially stay the same on iOS, but we’ll discuss Android right below the steps.

  1. Open Google Chrome.
  2. Using the Omnibox URL, navigate to the page you want to download from Google Chrome as a PWA. For this example we are using the image compression and light editing app from Google “Squoosh”
  3. Click or tap the Omnibox URL after the page loads.
  4. If the site is downloadable as a PWA, a new “installer” icon will appear on the right side of the Omnibox. Google has fashioned the install icon as a “plus” symbol inside a circle and usually just to the left of the star shaped bookmark icon. To begin with, the word “Install” should also appear briefly there, before disappearing from view.
  5. Tap or click the install icon.
  6. Click or tap “Install” in the resulting pop-up window to install the PWA.
  7. Once installed, the PWA will be presented in its own native-style window. Chrome places an appropriate icon next to other installed apps and software. On Chromebooks this should be in the app launcher, as shown in the images below, while on Windows it should be in the Start menu.

On Android devices, the current state of affairs seems to be that there is no native Chrome UI that tells users how to install a PWA. Instead, web apps seemingly need to include their own install button. For Squoosh, for example, the purple colored “Install” button shown in the sample images above also appears on Android. And by tapping on it, just like with desktop Chrome, a pop-up window will appear.

The main difference is that the pop-up asks users to add the Squoosh PWA to their home screen. This is similar to how the Google app, when looking for “weather”, presents this option to users. Choosing to add the Squoosh PWA to the Home screen will not make it appear in the app drawer on Android. It can be found on the home screen instead.

Keep PWAs up to date

Now, after installing a PWA from Google Chrome, you really don’t have to worry about updating the app. It’s not because they don’t need to be updated, of course. But, for the most part, PWAs will keep up to date. They actually update in different ways, but always when the installed device is connected to the internet.

For example, the Squoosh app used in our example doesn’t update as often as a regular PWA. That’s because it’s, under the hood, a basic photo editing app. Explicitly intended for compressing, resizing, and reducing the size of image files. So there isn’t much in terms of details for the user that need to change.

Instead, it will periodically receive improvements via an update when the Chromebook it’s installed on is logged in. When this happens, a pop-up window appears, telling users that there is a new version. Press the update button to relaunch Squoosh, much like reloading a website.

Things are different when a website is set up as a PWA that has a lot of user-oriented details that need to be updated. For example, a PWA news site will actually update every time it opens, as long as a connection is available. And it will do this in the background, much like a native app for the service in question. Google has worked to ensure that no user interaction is required. Once connected, it simply performs the update while it is open.

All of this means that, like a native app, unless there is a big change in functionality, users won’t need to do much to keep things up to date.

Not all sites or services are available as a progressive web app

One final note about progressive web apps is that not all websites or services will be available. At least not yet. As noted above, Google just introduced PWAs in 2019. The goal, of course, was to get everyone involved and build the apps so that the sites and services work on any. platform. Indeed, it was a matter of creating a “code once, publish everywhere” platform. But not everyone has bought into this. At least not yet.

Equally important, not all companies that have built a PWA, like Pandora, work with Chrome. The music streaming service allows the use of Pandora as a PWA in the Chromium-based Microsoft Edge browser. This requires users to navigate to Pandora, tap or click the three-dot context menu, scroll to apps, and then select an “Install” option. Thus, not all instances of a web application will work the same.

That said, more and more PWAs are added on a regular basis. So, if this happens, the installation process on Chrome should remain the same.


Comments are closed.