Progressive Web Apps vs Native Apps
As developers, we always try to find resources and ways to make implementing functionalities, as well as testing and launching an application easier for us. The greatest boom in recent years has undoubtedly been in the development of mobile applications. Since 2007, when the iPhone was launched, Steve Jobs introduced the idea of being able to run applications developed in Ajax and HTML5 that were a standard for the iPhone at that time. However, when the concept of the App Store appeared, it became very popular, leaving all of those ideas behind. With that in mind, today, we’ll like to take a look at what Progressive Web Applications (PWA) have to offer and where they stand in comparison to native apps.
What is a PWA or Progressive Web App?
A Progressive Web Application is a web app that runs on an instance of a browser, is able to consume native services of the device, and offers a native user experience. Let’s break down what each part of PWA entails:
- Progressive: Works for everyone, on all devices that support modern browsers.
- Web: Uses web standards like Javascript, HTML and CSS, all behind the facility of React to develop a responsive, clean, modern and safe web app.
- App: Runs, works and looks like a native app, including push notifications* and offline and local storage access support.
Source: https://developers.google.com
Why should you choose Progressive Web Apps (PWAs) over Native Apps?
One of the major advantages for developers is the fact that, to build a PWA, you need to code using React, which also provides the code for the website. So you’ll be developing a multiple platform app, native for Android and iOS, and also a web app, for all the other devices that integrate a modern browser.
Furthermore, React supports the use of CSS style sheets, which allows to easily integrate styles into any environment of the application, even having a main resource configuration file called manifest.json, where you can change variables such as the icon of the application, application mode, wallpapers, title, splash screen, and many others. There is no doubt this means the configuration can be done in a simple and centralized way.
Moreover, if you develop a PWA, you circumvent the fact that often resources such as styles, functionalities and libraries work differently for each platform. Programming and correcting these aspects usually requires a lot of time and money, in addition to the fact that there are often no libraries that support both platforms because the base language for each platform is different.
From this last point, we can conclude that the cost of developing a PWA is significantly lower than that of developing a native application for each platform. Not to mention saving you save the cost of publication in each of the app stores that requires a paid developer account.
Progressive Web App benefits
Here’s an overview of all the benefits of developing a Progressive Web App:
- Looks like a native app.
- Easy to develop with ReactJS; lots of documentation available.
- Fast and fluid navigation; uses Service Workers.
- Offline support, WebSQL database; LocalStorage access; push notifications*; allows access to device’s hardware, like Camera, Speakers, etc.
- Quick development; can see changes in real-time; uses a Node server.
- Totally responsive, adapts the design to all screen devices.
- Easy app installation by just going to the website and selecting the “Add to Home” browser option.
- Smaller size than a native app.
- Appears on the device’s app manager, providing the possibility to uninstall it, or clean the cache.
- Instant deploy: just deploys changes to the production web site and the changes will instantly appear on the PWA.
What are the cons?
Of course, like every tool, PWAs also have its disadvantages. Let’s take a look at them:
- Most users usually go directly to the device’s store instead of going to the app website, so it will cause a change of “routine” for the users that may be difficult to get used to.
- *Push notifications for iOS safari browser are not supported yet.
- It is not possible to access specific properties of the hardware of the device and the operating system, meaning you are limited to the basic functions provided by each system.
- If the icon, splash screen, app name or description changes, you can’t get an automatic update from the server. This does not happen with a native app, because just by updating it, you can get a completely new and different app if you want to.
Conclusion
To sum up, the choice of technology will depend on the requirements and resources of each client. If the objective and scope of the application to be developed do not require specific functions of the device, but do call for the possibility of web access and include a tight budget, the process of analyzing alternatives will probably lead you to develop a PWA as the best option for the client. On the other hand, if your client requires considerable fluidity with animations, access to specific resources of the device—such as the processing of data and content—, or access to specific properties of the hardware of the device, and has a flexible budget, the best option will without a doubt be developing a native application.
For either case, we recommend learning how to use React, React Native, and taking full advantage of them. ReactJS allows you to easily develop websites and PWAs. And, if you want to develop native applications, you should use React Native, whose code and implementation is very similar to ReactJS.
