Universal App Platform: State of Progressive Web Apps in 2019.
What started as best of both worlds, web and native, Progressive Web Apps can now also be installed and run in desktop, from Windows to Mac, from Linux to the Chrome OS. You code once and it can run anywhere, ensuring PWAs as the Universal App Platform.
In March 2019, it was announced that PWAs can now be installed in Mac OS, thus bringing support for PWAs to all desktop and mobile platforms.
As of Chrome 76, announced in July 2019, whenever any PWA url is hit, install prompt would be showed in address bar/omnibox, thus making it easier to discover.
Progressive Web Apps, PWAs, use modern web capabilities to deliver an app-like user experience. ‘App-like’ referring to the fact that PWAs are the perfect marriage between web and the native.
I would highly recommend you all to watch this year’s Google I/O 19 talk by Paul Covell and Dominick Ng to understand this merge, which tells you about the traditional differences between web and native apps…
..and how PWAs successfully manage to bring in the table the best of both worlds.
Back in June 2015, Alex Russell first posted about the Progressive Web App and the idea soon began to gain traction.
“Critically, these apps can deliver an even better user experience than traditional web apps. Because it’s also possible to build this performance in as progressive enhancement, the tangible improvements make it worth building this way regardless of “appy” intent.
Frances called them “Progressive Open Web Apps” and we both came around to just “Progressive Apps”. They existed before, but now they have a name.”
When users first came across a pop-up in their mobile chrome saying: “Do you want to add this site in your Home Screen?”, and pressed ‘Yes’, they noticed something amazing, beyond a simple bookmark, in their mobile devices.
After installation, users could see an icon in their phone screen. When tapped it opened in full screen, without any tabs of the browser. It became their first app that didn’t come from any App store/Play store!
In Google I/O 2016 when Jake Archibald showed the magic of how web apps can work offline, developers started to develop and convert existing applications into PWAs with much interest.
I had the privilege to introduce PWAs in my office back in September 2017, and fast forward to 2019 we have already deployed PWAs for production as well.
But let’s go over the core features of PWAs again today and relate their state in 2019.
As Dominick Ng puts it, PWAs are just like another website but with some added pieces in it. And the pieces are increasing in number, progressively with time.
Being progressive has several meanings. PWA’s app experiences get better with time, progressively, as frequent usages lead to better caching. Push notifications, for various events inside the applications, make it even more engaging for the user to keep on using the app. PWAs never discriminate who can install and use it. From a mobile user with 2G connection to 4G user both can use it without much data concerns. It doesn’t even discriminate which device they are using, unlike certain native apps and their devices/OS bindings.
Incremental feature sets, expanded capabilities of modern web APIs, and their adoption, powers PWA to deliver more native like experiences. For example, we will soon have native file system API integrated in PWAs, that will allow users to access their phone storage directly using PWAs, and that too with prior consent.
PWAs are reliable, can only be served over https and are also fresh, meaning that users do not need to run update every time when there is a change from the developer’s side, unlike those of native applications.
Responsiveness and full screen UI, powered by Web App Manifest (a JSON-based manifest file that controls the the web application’s name, links to icons, sets default orientation of the app), also helps to generates app-like experience for the users.
Features like offline support which are powered by Service Workers (think of it as a proxy server between your browser and the network, which controls what requests are being sent to and from the network) help users to engage more than often with their application and thus feeling a sense of ownership like that with any other native apps independent of network connection.
Service Worker’s ability over caching and how requests are being handled, ensures implementation of strategies like Cache First Strategies, which offers PWAs as a fast application that consumes less network data.
The App-Shell in mobile allows PWAs to have a faster first-paint, i.e. how fast the screen loads before the dynamic content is loaded in user device, even in flaky internet connections.
Since PWAs are applications which we do not need to download from the app stores/play stores, it is like any other website link that can be found in a google search result and also can be shared to anybody. When anyone visits that url, it will ask users to install the app in their phone or desktop. And done. It is installed! Thus making it highly discoverable over native apps, as still now we can’t find app links in google search results.
But as of now, many clients want to move their PWAs to play stores so to be discoverable in play stores. Yes, you can also ship your PWA to Play store, as Chrome announced Trusted Web Activity (TWA) this February 2019.
In short, TWAs are better than traditional sandboxed WebViews, as it handles more PWA features like that in PWA in browsers, e.g. OAuth redirections, sharing cookies, local storage etc.
When it comes to expanding capabilities, here is the list of modern web APIs that can be used by PWAs.
Also the PWA Google team showed a roadmap as to what to expect and the tentative launches for the in-flight APIs.
However, it is true that adoption of most of the expanded capabilities are not present in Safari as of now, but the fact that Service Workers are included from Safari 11.1 onwards, the PWA features similar to Chrome will surely be adapted with time. For now features like geolocation, sensors (Magnetometer, Accelerometer, Gyroscope), camera are included but push notifications are still not included in iOS PWA experience.
There is a checklist as to what corresponds an app to be PWA, feel free to go over that. And also once you make an app, you can use a tool, Lighthouse to see your PWA score so to understand better how well your app performs as PWA.
You can make a web app, you can make them offline first, turn them into PWAs, leverage installation and system integrations, and take advantages of the best of the web and native worlds. Hopefully we’ve shown you just how compelling Progressive Web Apps are as a universal app platform and how much more compelling they’re going to get over the next year.” — Dominick Ng at Google I/O 2019.
When comScore 2016 reported that 1/2 of the U.S. smart phone users downloaded 0 apps/month, it raised alarm and a bit of shock in the ecosystem. But native apps are always meant to stay for their specific use cases, no denying that fact for sure. However, with PWAs making giant steps in redefining how we view and develop web applications, a paradigm shift awaits. The development landscape for applications in future years will surely change as users look for applications in search results and appreciate ways to easily download/install apps with minimum pre-requisites. Clients would also love to re-use singular code base for multiple platforms to cut down costs without hampering quality.
Feel free to reach out to me on Twitter (@saadbinamjad), and also you can read more engineering articles in our blog. Thanks, till then happy coding!
