I am confident in predicting that we will see Progressive Web Applications (PWAs) take over from native applications in the next few years. In fact, I believe at least 80% of new non-gaming apps on mobile phones in the next 5 years will be created using web technologies.
PWAs have been around for 12 years
Steve Jobs was right in 2007. Not only was he right about what mobile phones would look like for at least the next 12 years, he was also right about what mobile apps should look like. He announced that the standard format for apps on iPhones would be what we now call HTML5. Apps would require no SDK, have easy access to native functionality, and thus be easily buildable by anyone with a web development background.
It didn't take long for Apple to decide this was no longer the direction they wanted to go. They introduced the iOS SDK and native development became a lot more complicated. Functionality that was intended to work in-browser became native-only, forcing developers to learn new languages and shift towards becoming native developers.
Since then, web development has grown a lot. Many web applications are now more feature-rich and impressive than their native counterparts. JavaScript has become a force to be reckoned with and with the introduction of PWA support in both Android and iOS, there's a real future where web developers can build native-ready applications without needing to learn an entirely new language.
PWAs are the best of us
A Progressive Web Application is not like any other web app. There are a few characteristics that these specific applications have, and a couple requirements that need to be met in order for an application to be considered a real PWA.
R E L I A B L E
A progressive web application needs to be accessible even when there is no internet connection available, and that doesn't just go for one "We are not currently available"-page. Every URL needs to be accessible, even if it's just to show the data that's been cached. On top of that, PWAs have to be served over HTTPS, need to be responsive on tablet & mobile devices and the entire site has to work cross-browser.
F A S T
A progressive web application needs to be quick. It needs to be quick enough to not drive a person insane when they try to load it on a 3G network for the first time. So get that async script loading up and running, remove some render blocking CSS and optimize the code that's still there!
E N G A G I N G
Last but not least, a PWA needs to be engaging. It needs to feel like a native experience, that's smooth and acts consistently. No janky scrolling, no waiting for navigation to happen and when there's an important update you need the user to know about, your PWA can even support push notifications. Maybe most important to the native experience is launching the app. These apps live on the user's home screen, meaning they need to have a manifest containing all the necessary icons and have functional splash screens while your app loads in the background.
Support is growing
While originally designed to feel native to mobile devices, PWAs are being supported more and more, including a recent update to Chrome (73) that made it possible for PWAs to be installed on Chrome OS, Linux, Mac and Windows PCs. Of course not all features are supported immediately, but as PWAs become more popular, so too will their features increase per platform. Currently, only Chrome on Android supports all major features you would want in a PWA, but Apple's Safari (on iOS) is quickly following suit. Soon, there will be no real difference between the capabilities of a native app vs those of a PWA.
It's so easy
Building a PWA is incredibly easy. If you have any experience working with VueJS and their CLI, you'll have probably made a PWA already, even if you don't know it yet. Yes, PWAs have strict requirements and need to work really well, but it's no longer difficult to make your pages feel quick and smooth.
PWAs are not some obscure technology anymore that you need to figure out by combining 12 different StackOverflow posts. There are plenty solid guides out there for writing these applications and optimizing them for every OS. Google has an incredible guide on how to create your first PWA without using a JS framework, and there are many guides like it for different frameworks and standards.
In future articles I'll write a guide on how to get started with PWAs in VueJS so if you're as in love with Vue as I am, then stick around!
In conclusion
PWAs are the future, as they are our past. Google might have coined the Progressive Web App term, but Steve Jobs envisioned them over 10 years ago. There's a future out there where you write your native-like applications using JavaScript, without having to go through difficult build steps and frustrating app stores. With nearly full access to a device's native functionality, PWAs are bound to take over from native applications and become our #1 way of creating incredible experiences on all devices.
Latest comments (60)
Nice article and the comment sections is awesome!
But a month ago, I was decided to implement a
PWAfor my company and started some upgrade and stuff. But something told me, "take a time to see a little bit of Flutter" and was a right decision too.But I'm back to the first step,
PWAis awesome butFluttergives me more productivity and direct to the business part, doing even less customization (CSS) and layout decisions.I guess the
navivexPWAanyone can search and study the differences, but has a new guy in town and his name is Flutter, and the page was turned (again).Now we need to discuss another topic,
FluttervsPWAhahahahaPWAs on iOS are not viable. Apple just announced major investments in the Swift ecosystems (SwiftUI) they won't cripple their own app store.
It just won't happen, they will always make sure that PWA can't be as good as native iOS apps.
On Android the picture is different, on desktop PWAs are great for perfs and to deliver a better UX.
I'm a front end with 6 years of experience and design too, next thing I'm learning is React Native or Swift.
What do developers consider best practices and productive tools for building PWAs? Has anyone written widely on engineering such solutions?
There are many articles on building PWAs and a few standards set by Google. I'm going to be writing my collection of best practices on Dev.to soon as well, including tools I use and results I'm looking for.
But what about bleeging edge technologies like AR and VR? Can the possible leave native?
These types of technologies are one of the reasons why I see 20% of apps still going for Native. Web is super strong, and very useful for most apps, but there will still be use cases where you need that native boost.
I'm actually working on a site that will have all this information (and more!) listed per browser. I know for iOS a user needs to turn on sensor information themselves, but I'm not entirely sure how much sensor information you get access to. I do have a project I need to use sensor data for though, so I'll find out and get back to you!
Amazing Article..!!! The loading time of PWA is approx. 2-3x faster compared to responsive designs. Google mobile-first indexing helps it to express the high speed of PWA.PWA is the future of mobile app development.
is there any plan to add PWA to smart TVs? writing an app for smart TVs is a pain in the ass.
Some comments may only be visible to logged-in visitors. Sign in to view all comments.