Progressive Web Apps Vs Native Apps: What's the Best Choice in 2024?
- A Progressive Web App (PWA) is a responsive website that delivers an app-like experience.
- Compared to native apps, PWAs offer a faster and cheaper development time, plus cross-platform compatibility.
- Native apps provide a better user experience and wider functionality, but typically cost a lot more to build.
- Many businesses opt for both - you can get the benefits of both by converting your PWA to native apps with MobiLoud.
Trying to decide between building a PWA vs native apps? This article will help you decide.
The mobile user experience is more important today than ever before. People consume 2x the amount of content on mobile than they do on desktop. Mobile holds nearly 60% market share of all internet users, against less than 40% from desktop.
That's more people who are mobile-first, which is why many businesses are investing heavily to ensure they meet the expectations of modern users.
While having a responsive mobile website is a must, businesses who want to cater the best experience to mobile users will want to go further.
There's native mobile apps, that users can download from the app stores and add to the home screen of their mobile devices, and the recent entry of Progressive Web Apps (PWAs) into the arena, which takes an approach midway between mobile websites and mobile apps.
Read on as we take a look at the PWA vs native app debate in more detail, and see how they stack up.
What is a Progressive Web App?
Progressive Web Apps are something between a responsive website and a mobile app.
They are mobile sites built with modern JavaScript frameworks, designed to give an app-like experience. They can be added to a mobile device's home screen with an icon. Like apps, they offer a full-screen experience to engage users. However, they are still just a website when opened. With the development of Service Workers, PWAs do get some more benefits that native apps have, however, these benefits are still limited, particularly on iOS.
Google defines PWAs as web experiences that are:
- Reliable - Load instantly and never show a website as being down, even in uncertain network conditions.
- Fast - Respond quickly to user interactions with silky smooth animations and no janky scrolling.
- Engaging - Feel like a natural app on the device, with an immersive user experience.
SD Times reported that Todd Anglin, VP of Product and Developer Relations at Progress believes "PWAs are about making the web a more reliable, enjoyable experience, but there will always be a category of apps best served by native".
This leads us to some questions for business owners trying to decide -
- "What’s best for my company".
- "How do progressive web apps really compare to native apps?"
- "Can progressive web apps replace native apps?"
We'll answer all these questions below.
Progressive Web Apps vs Native Apps: What’s the Difference?
It seems like a simple enough question to answer: Is there a difference between progressive web apps (PWAs) and native apps? (Yes.) If so, what are those differences and how do you choose between a native app and a progressive web app for your company’s mobile presence? (That depends.)
At the end of this article we'll provide a summary of the pros and cons of building a PWA vs native app. If you want to skip ahead, feel free, otherwise read on for a bit more depth, as we break down 10 key differences between PWAs and native apps.
1. Installation
A key difference between PWAs and native apps is the way the end user accesses them.
Native applications are found and installed through an app store, such as Google Play or Apple’s iOS App Store. App Stores act as a massive shopping window, the gateway towards all services and content people consume on their mobile devices.
The opportunity for app owners is considerable. If you do App Store Optimization well, you can introduce your brand to new users that are searching for related keywords. If you have an existing brand, you can count on people looking you up on the stores too, which happens a lot nowadays with apps being a modern consumer expectation for digital businesses.
Once installed, the app will appear on the user’s home screen with a recognizable icon and text label that can capture the attention of the user whilst they scroll through their home screen. It really is valuable real estate.
PWAs, on the other hand, run on the mobile device’s browser. The Financial Times PWA is a good example of this:
As you can see in this example, The Financial Times' PWA looks very similar to what you'd expect an app to look like.
Users access a PWA simply by inputting the URL in the mobile browser. If users aren’t aware of the concept of PWA, they may be surprised to encounter a truncated version of the website, when they expected an experience that mirrors the one from the regular site.
However, once they do discover it, it’s (theoretically) easy enough to save the PWA to the home screen and find it there just as they would a native app.
The only obstacle your users may run into is knowing how to add it to the home screen. PWAs are still relatively new, and the concept of adding a "website" to the home screen of the device isn't the norm for the average web user. This is in contrast to the idea of installing a mobile app from the App Store or Google Play, which almost everyone is familiar with.
That said, the latest Android versions prompt users to install a PWA (as you can see in the above image), while iOS is still relying on the old “Add to home screen” action for this.
On iOS your user will have to visit your PWA’s URL within Safari and then manually press the Share, then tap on “Add to Home Screen”. There will be no visual indicator that your website is a progressive web app. As you can imaging, this makes it somewhat tricky to get iOS users to install it.
2. Cross-Platform Availability
Since developers usually design an app specifically for iOS or Android users, this ensures that the experience within the native app is tailor-made to each operating system. Developers have to worry less about cross-browser or platform compatibility and more on shaping their app for one specific mobile device. This has exceptions of course, like if you build hybrid apps or use a cross platform framework like React Native.
Progressive web apps generally take a different approach.
Developers create the responsive instance of the PWA, publish it, and then leave it to the user’s browser to display it correctly within the screen’s parameters. It’s just one app to develop and users across a wide range of mobile browsers can engage with the app thanks to modern web technologies.
The one point worthy of note here, however, is that the interface of the PWA typically attempts to strike a balance between what you’d find with a responsive website and what you’d encounter in a native app. Here is an example from the FT PWA:
With native apps, developers have the opportunity to create a more user-friendly experience as the app is designed specifically for the structure of a mobile app.
With PWAs, the time and cost saving can be significant, since unlike native apps, a single web app can be loaded on both iOS and Android (and browsers like Firefox on other systems too!).
There are ways to easily build cross-platform mobile apps too though. MobiLoud let's you launch to Google Play and the App Store by converting your existing site into iOS and Android apps. It gives you all the advantages of native mobile apps, with the efficiencies of a PWA - more on that later though.
3. Offline Usage
One of the great things mobile apps do for the end user is giving them the ability to access the information they want without having to be connected to the internet.
What used to be a prerogative of apps, is now coming to the web as well. A PWA is a web-based app that gets installed on your system and, where possible, works offline utilizing cached data.
Service workers are the most important technology allowing offline use in PWAs. Service workers are basically JavaScript files that run independently from the web app itself.
They help improve performance and features by handling network requests, caching app resources (and fetching cached resources), and, best of all, enabling push messages even when the user isn’t online.
There's a tradeoff here, as you might imagine.
A PWA can serve certain parts of the app to users when their device is unable to connect to a network. However, a PWA cannot serve all parts of the app to them; specifically, anything that isn’t part of the page’s natural caching system will be offline until connectivity is restored. So, if a user wanted to submit a contact form to Forbes or make a reservation on Trivago, they’d be unable to do so.
Native apps definitely win in this category. While it’s great that the technology of PWAs is catching up and allowing users to access cached content, they’re just not quite at the point of being able to offer a fully functional offline mode.
4. Storage, Data, and Power
When a native app is installed on a user's device, it’s going to pull directly from the device’s resources.
For "heavier" apps, ones that users interact with frequently, or those they forget to close altogether - resource use in terms of power/battery, storage space and mobile data use can be significant.
PWAs can cause similar drainage issues. The Safari app causes nearly as much of a burden as the most commonly used apps on the phone. Really, what it boils down to is:
- How well-coded the app is,
- How many resources the app calls on,
- The user’s actual usage of it.
If you’re trying to reach an audience that lives in a region where data networks tend to be more expensive and users unable to pay for it, then a PWA is going to be the best option.
Google highlight that Konga cut data usage by 92% when they turned their mobile website into a PWA. Having a PWA that didn't use much data was was essential because nearly two-thirds of Nigerian users (Konga's home market) access the internet on mobile via 2G networks.
Some native apps can work and store content for offline use too, which might help with spotty connections (but not as much if data is expensive).
5. Updates
For the most part, there’s really nothing for users to do when it comes to updating native or progressive web apps.
There may come a time when a native app requires a manual update, but, for the most part, the process is automated and users will barely detect when an update has gone through.
For progressive web apps, since they're essentially just a hosted website, any updates appear whenever a page is refreshed or a new session begins. The update process is simpler - but realistically there's very little difference to the end user.
6. Discovery
For native apps, there are two chances for them to show up in search results.
- Within the App Stores
- In search engines
However, both of these depend on a number of superficial factors since the pages of the app itself cannot be indexed and listed in search engines. Instead, you have to do what’s known as App Store Optimization (ASO). This involves app search optimization tactics like:
- Identifying a commonly searched-for keyword (in the app store) that aptly applies to your mobile app and include it in your app title and description.
- Using a strong title/headline that includes your selected keyword.
- Developing a snappy and yet thoughtful description of your app. You want to quickly appeal to app store users, but also make sure they understand what they get from the app experience. Make sure the keyword is included here, too!
- Customer ratings play a huge part in a native app’s overall success, which means they’re going to factor in with SEO as well. Don’t be afraid to reach out and ask current users to leave you a review (which you can do with Push Notifications).
- You will also want to see that downloads number go up as well. Pitted against competitive apps that don’t have as many downloads or aren’t as well-reviewed, this form of social proof will help you attract new users.
The app store will also be a big help in driving traffic to your new app if you utilize the categorization feature well. The more niche and specifically labelled your app is, the more relevant app store search results it will appear in.
A progressive web app, however, will do well in terms of web SEO as it works like any other website you’d encounter online and its contents are indexed by Google and Bing.
As you can see in this example, the Financial Times PWA looks just like any other search result you’d see. It also gives links to relevant pages within the app.
Cleveroad highlight that this instant use opportunity for PWA may allow a higher volume of traffic to reach your PWA than your mobile app in an app store initially.
7. Push Notifications
Push notifications are one of the key reasons why many site owners and businesses are building a mobile app.
They attract significantly more engagement than traditional methods such as email. Reports show that Push Notifications in certain industries can get up to 40% click through rates (CTRs), whereas emails typically generate around 20-25% open rates, with CTRs of around 3-6%.
You can build the functionality needed for push notifications from the ground up, or easily integrate existing push notification solutions into a native app using a third party push notification service such as Google Firebase, PushBots, or OneSignal.
You can also use Push Notifications in Progressive Web Apps, thanks to the development of Service Workers.
However, at this point, Push Notification support is still limited to Chrome, Firefox and Opera and Mac Safari, and crucially is not available on iOS. This means that you can start using Push Notifications to engage your audience with a PWA on Android, but if you want to do the same to your iOS visitors, you're going to have to wait.
You shouldn't count on Apple & iOS supporting this in the near future either, they take a dim view of notifications in general.
PWAs are definitely making progress when it comes to push notifications. However, native apps are the clear leaders in this category. Native apps can support push notifications on both iOS and Android devices making them the right choice for any website owner who wants to engage their audience through this powerful medium.
8. Security
Security and privacy are key in today's age, and companies need their mobile apps to be secure, protect their user data, and be GDPR compliant too.
Native apps have the capability to be a secure solution for both the app owner and users. It’s easier to use Multi-Factor Authentication in a native app than in a PWA, which is useful if an app has login functionality. Multi-factor authentication adds a large layer of security to native apps.
Native Apps can also use certificate pinning to prevent certain kinds of attacks, which in-browser apps such as PWAs can’t emulate. Despite this advantage for Native Apps, PWAs are still served over HTTPS which does allow for browser-to-server encryption. As long as the website owner has created a secure environment for the PWA, it can be just as secure as any website.
However, to get your native app published on the iOS and Android Google Play and iOS App Stores, they have to be authorized by either Apple or Google first. Apps that present clear security issues for users are highly unlikely to get accepted, so in the majority of cases an app downloaded from these sources will be trustworthy.
Although there may be more work to build the security features for native apps, it has the potential to be more secure than PWAs, thanks to the ability to build in security features. Data security is always a delicate subject when building anything for the web though. You can’t afford to be the cause for compromised data, so this one is going to lie on your shoulders - native app or PWA.
9. Device Features
One of the mot potentially useful things about building native mobile applications for placement on a user’s mobile device is its ability to sync with other device apps and telephone features.
For example, native apps can use the:
- Camera
- GPS
- Geofencing (for marketing purposes)
- Accelerometer
- Compass
- Contact list
- Alarm
- Calendar
- SMS and push notifications
- Near-field communication and mobile payments
The DeeperBlue native app (built with MobiLoud) asks users for permission to send push notifications to their mobile devices.
Also, unlike browser windows that can only request that information once before being blocked entirely, apps like Deeper Blue can offer users the choice to opt-in at a later date, easily accessibly from their Settings.
Progressive Web Apps can be thought of as a toolkit that offer you the potential to take advantage of device features, but they don't strictly offer a certain set of features.
As Peter O'Shaughnessy writes:
"It’s [your choice of PWA features] not all-or-nothing; you’re free to cherry-pick. For example, if you don’t want to introduce push notifications, you don’t need to!"
Progressive Web Apps in their most basic form can be held to the same kinds of restrictions as standard websites, which means you don't need to add access to device features. You can make some connections that can be made through APIs (like social media logins) to improve the user experience, but limitations exist.
If you want your app to benefit from tapping into all the device features that native apps can, (such as fingerprint scanners, GPS, and camera) native could still be the more appropriate choice. For most businesses though - using these features is not necessary!
API integrations may open up functionality to other software for users on a PWA, but it won’t give them the ability to sync their app to their phone the way a native app does.
10. Cost
Finally, we come to the matter of cost and the time to launch.
A native app — if truly native — is generally built with in Java or Kotlin for Android or Objective-C or Swift for iOS.
The downside is that native apps require a long, costly, drawn-out development processes, which gets duplicated for each platform.
The development cost for Native apps is generally $50,000 to $100,000 to get first versions out on iOS and Android, and another 20% of that annually for maintenance and updates.
They will also take several months to build at a minimum.
There are cross-platform development frameworks such as React Native, which can help offset these drawbacks by making a large portion of the code reusable between iOS and Android.
When developing your native app in-house, you’re looking at two additional hires (at a minimum) and existing staff time spent commenting and testing. You might also have to consider the cost of outsourcing development if your team isn’t capable of handling it on their own.
With these high barriers, mobile app development becomes a big, risky challenge for smaller businesses.
The progressive web app, at its core, is basically a web app built in any one of a number of ways (although React.js and other similar frameworks are certainly popular), with the addition of service workers.
Developers need to replicate a lot of what the native and mobile SDKs already provide, so it still means investing in research and development, the same as you would with native app development. Building PWAs is significantly easier than building native apps though - and the costs in both time and money reflect that.
Why Not Both?
Many people look at it as PWA vs native app. But realistically, PWAs and native apps are not competing with one another. Progressive Web Apps are not necessarily meant to replace native mobile apps. You can (and should, in our opinion) utilize both for your business.
Making your website into a PWA provides a better experience for mobile users on web browsers, such as those who find your site via Google search or referrals from social media or other websites.
Then for your regular users, you can offer a native application that they can download to their own device, for easier access and a better overall user experience.
This lets you deliver an optimal experience for users on multiple platforms, and ensures that your site will look and feel perfect for any user who comes to your site on mobile.
If you want to learn more about progressive web apps, check out our detailed guide with 50 PWA examples.
Summarizing: Progressive Web Apps vs Native Apps
We've gone through 10 points that show the differences between progressive web apps and native apps.
Both native apps and PWAs offer a big improvement in user experience over regular, mobile-responsive websites. But between these two solutions, there clear differences, pros and cons.
Here's a summary of the main benefits of each:
Progressive Web Apps
- Easier and faster to build
- Lower development costs
- Lower cost to maintain
- Discoverable via Google search
- Can be installed on users' devices (though not as intuitively as with native apps)
- Can use push notifications (limited to certain browsers & operating systems)
Native Apps
- More secure
- Can be used offline
- Allows use of device features (such as GPS and camera)
- Gives access to Google Play and Apple's App Store
- Easy, one-tap installation and direct access from the user's home screen
- Allows full use of push notifications on multiple operating systems
To sum up, Progressive Web Apps are simpler and cheaper than native apps, while offering an increase in performance over mobile websites. Native apps, however, offer more power across the board, with a better all-round user experience than you can provide with a PWA.
That increase in power comes with an increase in cost and complexity too - however, as we'll establish in the next section, there is a way to get the power of a native app with just a fraction of the investment.
MobiLoud: Combining Native Apps and Progressive Web Apps
If what you need is a way to translate what you've already built for the web into native app form, and get the most important associated benefits, there's a better route - converting your site into native mobile apps.
Our platform gives you the advantages of both native apps and PWAs.
You get all the most important native app features, at a much lower cost that is more in line with what you'd spend on a PWA. It's the best of both worlds. If you use MobiLoud to build mobile apps, you may still have plenty of resources spare to build a PWA too!
All our solutions are, at their core, a conversion process. You'll take your existing site or web app, then use our platform to convert it into native apps for both iOS and Android.
If you're looking for a way to provide a better user experience for mobile users, and don't have the time or budget to develop a native app from scratch, MobiLoud is a better option than creating a PWA, because you can launch your app easily on the Google Play Store and Apple App Store, and deliver a contained experience that's not reliant on a web browser.
The apps will be ready to launch in under two weeks, for less than 10% of what you'd spend on traditional native development.
However, as we mentioned, there's still no need to choose one or the other. You can still maintain a progressive web app alongside a mobile app built with MobiLoud.
Ready to deliver a better mobile experience? Get started with a free consultation with one of our project managers, and we'll explain how you can go live with your own mobile apps in less than a month.