Nowadays we have so many ways to be cost efficient in mobile app development. Earlier all you could do was build a native app for respective platforms. Spending twice the development costs to make apps for iOS and Android platforms was unaffordable for small entrepreneurs. Now with the rise of cross-platform development options, making two apps using a single codebase has become increasingly more popular among the developers.
At first, it would be a bit confusing while trying to understand the difference between these two technologies—Progressive Web App and Flutter apps. Technically, they both are cross-platform apps but some factors make them differ which fulfils different needs for a desired app.
Before starting to predict the winner, let’s introduce the meaning of both technologies and what is the importance of both.
Flutter is an open source released by Google in 2017 for building fast, natively compiled, multi-platform apps from a single codebase. Flutter apps are written in the Dart language which can be compiled to ARM or Intel machine code as well as JavaScript, for fast performance on any device. The single codebase can be easily deployed in Android, iOS, Windows, Linux, macOS, Web and Embedded. Apps like Google Ads, Google Pay, Stadia, Dream11, eBay, BMW, Tencent and many more are built from this framework.
PWA stands for progressive web apps. A Progressive Web App is an application that uses modern web techniques and capabilities to deliver an app-like experience to the users through a web browser. A progressive web application is a type of application which is built using common web technologies which includes HTML, CSS, and JavaScript. It is intended to work on any platform that uses a standard browser, including both desktop and mobile devices. Apps like Alibaba, AliExpress, Trivago, Twitter Lite, Pinterest, MakeMyTrip, Flipkart, OLX and many more apps are trying PWA and are happy with their results.
Performance - JavaScript can handle the multicore nature of modern CPUs better and distribute workloads more evenly, despite the language’s nature being single-threaded. JavaScript can now better handle CPU-intensive workloads and can actually beat languages like Dart.
Feature support – Device Feature support like camera, Bluetooth, location, etc. are not accessible for PWAs especially for iOS. Whereas, Flutter apps have deeper access to the device’s hardware features due to which the complex apps can work more seamlessly.
Data usage and connectivity - The Progressive Web Apps can work offline. It allows users to browse the app even when the network connection is poor or absent, which is impossible for fluttering apps or the web. Due to its less space consumption, it uses less data to load pages. Now getting the work done with less data usage , without installing numerous data draining apps, is somewhat the internet users actually looking for!
Speed - Faster page loading speed of PWA , in comparison to flutter apps, provides an improved user experience that can eventually result in boosting your conversion rates. MakeMyTrip switched from native to PWA and the comparison results were quite impressive. Their website had 38% more conversion rate than their native apps and loaded the app 3x times faster.
Space Complexity - PWAs take much less space compared to flutter apps. Pinterest is a great example as it takes about 40 mb to install from the play store whereas the PWA version of Pinterest takes about 150 kb (i.e. browser caches).
User Interface – For high conversion rates and less space consumption, sacrifice of detailed UX is required. This is the main reason for PWAs to be lite and fast. On the other side, Flutter has pixel perfect UX which can make the in-app experience so much more engaging.
Development factors – Due to more code reusability opportunities, PWA is faster to develop in comparison to Flutter apps. Usage of third party packages in Flutter hinders the code reusability.
Updation – Updating apps is kind of hectic and lazy thing to do as a smartphone user as it drains data and consumes more space of our internal storage. Flutter apps can be updated as soon as the app store authorizes a new version. PWAs get an automated update.
Device compatibility – As PWAs are browser dependent, it would only work in devices which support HTML, CSS and JS. Till now, web activity is not supported in Android TV and embedded devices. Whereas, Flutter has more target devices.
Search engine aspect – Functionality support for PWAs differ according to the respective search engines. The least supportable till now is Safari search engine. iOS is still trying to support more features for PWAs to work. Recently, Safari 15 supports theme colour and ES6 modules.
So this really is a tough call. PWA's will certainly be able to give Flutter a good competition. Both are improving on their own and becoming more and more stable. Which one to choose can only be answered according to the needs for the app. If you want an app which needs device feature support and user-friendly UX, then go for Flutter. And if your app should be built in a cost efficient way, then PWA would be the right choice for you.