Web app, PWA or native app? Advantages and Drawbacks
Tags: webdev, pwa, beginners, mobile
Published: 2023-03-02 12:33:34

In this article, I would like to use a fictitious project to explain the difference between **web apps**, **native apps** and **PWAs**, where they are used and what their **advantages** and **disadvantages** are. 

The example project involves an order for an app to perform **surveys** at trade fairs. The app is needed to run on the **tablets** and **smartphones** of employees who use it to approach visitors and ask them to take a survey. The app is to run on both **iPads** and **Android tablets**.

In this case, is parallel development for **Android** and **iOS** the best approach to achieve the given goal? 

Dual development involves a significant amount of extra work and requires a lot of **time** and **money**. Also, since this is an **internal application**, there is no need to promote it via the App Store. Therefore, the question arises as to what is the suitable alternative to a classic native app. This is where **modern app development** offers many interesting choices for effective implementation.



## Web apps: Plaftform flexibility vs. limited functionality
A webapp is a complete application that runs within a browser and uses the same technologies as a website, i.e. HTML, CSS and JavaScript. Almost everyone uses webapps in their daily routine. For example, when using Gmail or Office365.
The distribution of a webapp is done in the same way as a website, by letting the user access a URL and use the application right in the browser. There is no download or installation required, but there can also be no marketing through any app stores. In general, web apps cannot be placed in the popular app stores, but this also eliminates the ongoing cost of placement in the app stores (Apple: US$99/year, Google: US$25/year).

As a developer, you also have to consider whether the app needs access to features on the device that the browser is unable to provide or can only provide in a limited way. A webapp cannot access the device's hardware directly, which eliminates this option for compute- or memory-intensive applications.

Although a webapp may look visually like a native app, it still runs entirely in the browser. This will also be noticeable to survey respondents at the trade show, especially when they are scrolling, and the browser's menu and URL become visible. Although this does not limit functionality, it does not look or feel high quality and the customer will perceive it as just a web page, regardless of the overall complexity of the web app.

Furthermore, usability issues may possibly occur if the user accidentally switches the displayed web page or triggers the "Back" button and consequently loses progress in the survey. A proper full-screen mode that suppresses the browser's default functions is not available.

Even though a web app is cheaper to develop overall, a native app looks more premium overall and there are no distractions for the user from the featured content. 

So, in summary, the following advantages and disadvantages can be highlighted:

**Advantages:**
- Easy and fast development due to standardized web technologies
- Platform independence
- Execution and distribution via URL
- User doesn't need to update the application
- No placement in app stores necessary

**Disadvantages:**
- Application is not available offline
- Hardware access limitations
- No compute or memory intensive applications feasible
- Application always feels like a website
- No marketing via app stores

 

## Native apps: More functions, more effort
Developing a native app for iOS and Android consumes significant developer resources. Development in the Apple ecosystem is done in Objective-C or Swift, while Android development is done in Java or Kotlin. This illustrates that it is not trivial to develop the same application for both systems, resulting in significant additional work. Frameworks like "React Native" or "Flutter" try to reduce this redundant effort, but have their own challenges. Compared to a web app, the time and cost required is significantly higher.

However, there are situations where there is no alternative to a native app. Computing-intensive apps like games or AI apps require the full capabilities of the device they are running on, which a webapp can't provide. Also, while camera or microphone interaction is available in webapps, it is significantly more limited.

Of course, once the app is developed for both systems, distribution through the App Store can be beneficial. The App Store offers numerous marketing channels, such as placing ads, mentioning the apps on several App Store pages, or displaying them as "similar apps" for more popular apps. In addition, good user reviews can increase the discoverability of applications. Currently, there is no better place to market an app.

For our showcase project, the placement in the app stores (Apple App Store and Google Play Store) is not important, since only the employees needed quick and easy access to the app. This is not a big issue with Android, but it requires additional steps with Apple. This is possible through the use of Apple's Testflight feature (actually only intended for internal tests) or through the Apple Developer Enterprise Program (299 €/year). However, the latter is only available for companies with at least 100 employees. It becomes clear that the topic of private applications is complex with Apple. As an iOS developer, you are to some extent trapped in the Apple ecosystem.

Let's summarize the advantages and disadvantages:

**Advantages:**
- Fully optimized for the system on which they run
- Can access the entire hardware assets
- Can be used offline
- Uniform GUI
- Can be marketed via app store

**Disadvantages:**
- Double development costs for Android and iOS development
- Many guidelines must be followed to distribute the app in the app stores
- Exclusive distribution through app stores
- Closed ecosystem at Apple
- Apple offers internal apps only with restrictions

 

So, how can we provide a high-quality app for tablets and smartphones for both Android and iOS without dedicating a large number of development resources? One solution would be a combination of a web app and a native app. An application that behaves and can be installed like a real app, with full screen mode, icon on the homescreen and offline availability. 

This is possible through the use of **Progressive Web Apps** (**PWA**).



## Progressive Web App (PWA) - the future of mobile App development?
"Progressive Web Apps" (PWA), or hybrid apps, combine the advantages of web apps and native apps by reducing development effort and improving the user experience. This type of web app can be installed by visiting a URL and then appears on the user's home screen with a predefined app icon. The user will not notice any difference compared to the native application afterwards. Although PWAs are executed within the browser in the background, they always start in full-screen mode after installation. In addition, push notifications can be used by the PWA, just like with a native app.

The Progressive Web App (PWA) offers a wide range of interfaces and an overall excellent user experience, when implemented correctly. In the case of our sample project, where we require an internal application, whether the app is downloaded from the App Store or installed via a link is of secondary interest. However, for most applications, placement in the app stores is critical to marketing. Both positives and negatives exist regarding the PWA and its placement in the major App Stores.

Although Apple supports the use of Progressive Web Apps (PWAs) and is moving in the right direction, it remains a challenge to place PWAs in the Apple App Store (only available via app wrapper). In contrast, Google and Microsoft allow PWAs to be published to the Play Store and Microsoft Store without restrictions or special labeling. I hope that Apple will continue to expand its support for PWAs in the future. But PWAs are of course competition for Apple's own distribution model via the App Store and Apple's stakes in app sales.

The implementation of the sample project is perfectly suited to be implemented as a PWA. The PWA only needs to be developed once and can then be deployed to all required devices. For example, employees can receive a link via email and install the app with one click instead of waiting for a long app store verification or using temporary test versions. Thanks to the offline capabilities of the PWA, employees don't have to worry about network stability. Thus, all the requirements of the sample project can be met by deploying a PWA.

**Advantages:**
- Easy and fast development due to standardized web technologies
- Platform independence
- Complete support from Google and Microsoft
- Execution and distribution via website URL or app store
- User does not need to update the application
- Easy maintenance
- Offline usage
- Can be installed with one click on the home screen
- PWAs can be found via search engines and linked on the web
- More device features as a webapp/webpage:

**Disadvantages:**
- No direct distribution through the Apple App Store yet
- No access to contacts, calendar, Bluetooth or NFC
- Support from Apple is only slowly expanding
- No compute- or memory-intensive applications feasible
- Older browsers/operating systems do not support PWAs

 

Progressive Web Apps (PWAs) offer the best option for the sample project and will hopefully become more important in the coming years. Especially when Apple increases their support. But every project has its own requirements, which is why each of the mentioned app variants has its raison d'être.

This article was originally published in german at [codecell.de](https://codecell.de/blog/webapp-pwa-oder-native-app-vor-und-nachteile)