There are times you want to install a native app on your device to get the full experience from a service or social media platform, and times where you just want to visit the mobile site every now and then and not bother with having the full app. Progressive Web Apps bridge the gap between the two situations, creating an app-like experience in the browser, and they've evolved so much in recent years that they're becoming viable alternatives to native apps. For instance, it's been over a year since I've installed a Twitter client on my phone, because Twitter Lite does the job for me. Now Facebook is following suit, and we can all gasp in relief because we finally have an official alternative to its bulky clunky native Android app.
The Facebook PWA is not showing up for everyone just yet. We got tipped about it a couple of weeks ago, but we couldn't replicate it and we weren't sure where it was rolling out. However, yesterday, both I and a friend of mine got the option, so it seems like Facebook is starting to expand this browser-based server-side test. (Because server-side tests in apps weren't enough for us to monitor and worry about, apparently.)
If you go to the mobile Facebook site, you may see a new pop-up at the bottom of the screen asking you to add Facebook to your home screen. Tapping it shows Chrome's regular "Add to Home screen" menu, except the icon is a little different this time. It's rounded, unlike the regular Facebook bookmark. It isn't an adaptive icon though, in case you were wondering.
Facebook suggests you add its new mobile app to your homescreen.
The differences between the non-PWA Facebook mobile site and the PWA one start from this icon. On your homescreen, the former shows the regular bookmark with the Chrome icon in the bottom right, whereas the latter looks like a native app icon.
Left: Non-PWA Facebook bookmark. Right: PWA Facebook icon.
Opening Facebook from these icons yields a different look too. For the regular non-PWA bookmark, you just get a new tab inside the full Chrome browser, with the top address and menu bar still visible. For the PWA, a white splash screen flashes first, then the site loads as if it were an app. It's still Chrome doing the heavy-lifting in the background, but the experience looks more app-like without the top bar.
Left: Non-PWA Facebook bookmark opens in Chrome. Middle & right: PWA Facebook.
Another benefit is that the PWA version of Facebook acts as a separate app in the Overview switcher, so you can close it or come back to it independently from Chrome. On a content level, there aren't any visible differences between the PWA version of Facebook and the regular mobile site, but perhaps more PWA capabilities are coming later — at least we hope so.
Left: PWA Facebook acts like a standalone app in Overview. Right: Facebook's service worker.
I have been using Facebook in Chrome for years; the idea of installing the app on my phone always felt superfluous and dirty given how little I check the site and how many permissions the app uses. With notifications enabled in Chrome, the experience was more than enough for my needs. Now with this separate icon and app-like behavior, I'm more than a happy camper.
As mentioned at the top of the article, there's no way for you to force this behavior from Facebook. You have to sit tight and wait for the server-side test to land for you on the mobile page. It's also worth noting that I tested this in Chrome, but it should technically work in all browsers that support Progressive Web Apps.
- Nitin Kumar