PWA vs React Native
Whenever building cross-platform apps, two things come to a mind, PWA or React Native. As these are the hottest technologies out there(You are free to consider others).
If you are an app developer today, which one should you prioritize and build for?
What decisions go into choosing one over the other?
The below points help in making the right decision on which one to choose or suits best for your needs.
Wait!!!
If Cost and Time aren't your problems, you should build both a PWA and a React Native solution and design the architecture of your app in a way to re-use as much logic between the PWA, React Native-Android, and React
Native-iOS projects as possible.
The PWA gets you the widest reach where any device with a browser can view your app.
The React Native app gets you richness/depth where you get to take advantage of a device's native UI controls for maximum performance and familiarity for users.
Here are some thoughts.
Are you going mobile-first or everywhere first?
If your goal is to target mobile devices (Android and iOS) only via the app store, then go with React Native.
If you want to reach the widest range of users and devices via the browser, go with a PWA.
If you want the lowest-cost option for your development team, then a PWA wins.
You write your app once using HTML, CSS, and JS and it will run pretty much everywhere a browser is available. If a browser isn't available (think smartwatches and so on), you can always build a hybrid app using a WebView that wraps your PWA and gets it on those tiny little screens:
To make your PWA work well across all of these devices, you do need to ensure your app is responsive/adaptive and relies on progressive enhancement. Knowing the range of devices you'll need to support upfront is key.
If you want the best UI responsiveness and performance, go React Native.
React Native uses the iOS and Android native UI controls, so you get to use the platform controls users are familiar with along with the snappy performance a non-HTML UI layer provides.
With a PWA, the interactions are always going to be a bit clunky - the animations will be less rich, multi-touch will be less responsive, the lack of multithreading will always keep your interactions fighting for priority with other things your app is doing, and so on.
If you care about low-end devices, PWA is slightly better than React Native.
While the UI layer in React Native is made up of platform controls, the underlying data communication is all JavaScript.
If you have an app that deals extensively with data, the slow JS throughput on lower-end Android devices is a very noticeable bottleneck that often makes the UI feel clunky.
React Native creates a native app package (~usually tens of megabytes in size!) that needs to be installed prior to the user seeing even a single pixel from your app.
PWAs load in the browser immediately.
This may be less of a problem in areas where you have plenty of cheap/fast bandwidth and device storage. If you are targeting large parts of the world where bandwidth and storage are problems, then a PWA is better. Installing an app from the app store is a major commitment, so giving users a lite version that is an instantly-available PWA and a richer version that is a React Native-based app (installed via the app store) is the best approach.
I do realize this suggestion falls under the magical world where there are no time and resource constraints and you can build multiple versions of your app, but sometimes that is the best solution. This is what Twitter did!
What are you (or your development team) skilled in?
There is always a nontrivial cost to learn new technology and train others on it. Both PWAs and React Native have their steep learning curves when you want to create a great user experience (especially at the critical last-mile), so keep this detail in mind as a factor.
Is your app consumer-focused or enterprise-focused?
Consumer apps tend to need a high degree of visual polish, and that tends to favor React Native because you get to work with native UI controls.
Enterprise apps should be visually awesome as well, but that is often not a differentiator since most enterprise apps can't be substituted for something similar. A good PWA with (optionally) good offline capabilities could meet most enterprise requirements.
Do you need access to native device APIs?
PWAs are limited by the browser sandbox, so you can't go beyond what the Web APIs provide access to. If all you need is a webcam/camera, microphone, geolocation, etc., then you are good. If you need deeper access to customized hardware and sensors, richer Bluetooth support, and so on, React Native allows you to access the native hardware. You could take the Hybrid App approach using a WebView and fully extend your PWA with the code for accessing native device capabilities, but that will require you to still build a native app (even if Apache Cordova or Ionic make that a breeze) and go through the app stores.
Desktop or Mobile or both?
If you only care about the desktop, then React Native won't help. I do realize there are desktop ports of React Native available, but most aren't officially maintained by the React team and have various gaps that you will need to address yourself. A PWA will run well on desktops, but if you need more native access to lower-level APIs, the browser security sandbox will block you from getting that access unless you decide to rely on a WebView inside a native app (similar to Electron).
Top comments (0)