Making your application available on mobile (PWA, native, meta frameworks)

The road to mobile

Developing your own application requires resources that largely determine what choices you’ll make at what times. We wrote about this before, when Maurits compared the software’s complexity to the phase a company is in. Which team is best suited for what situation? The decision to develop a mobile application really adds another dimension to this.

From web application in the (mobile) browser to a full native app built specifically for one or more mobile platforms — you’ll find a variety of other options in between:

What do all these methods entail and what trade-offs can you make? That’s what we discuss in more detail in this article.

Making your current web application accessible on mobile

If your application only runs in a browser, you can do several things to make it accessible on mobile devices. The two main methods are mobile responsiveness and mobile adaptiveness.

Mobile responsiveness

With mobile responsiveness, the application automatically adapts to the screen size. Users still open the web application in their browser: on smaller screens, some elements are shifted to make everything fit properly.

Benefits

• Endless flexibility: You can apply this to an infinite number of screen sizes.
• Uniform experience: As the application always adapts to the screen size, it delivers a consistent user experience.

Downsides

• More effort: It requires more effort from developers, especially if they’re working with an existing application.
• Potentially longer loading times: As the entire website is always fully loaded, loading times can be relatively high.

Mobile adaptiveness

With mobile adaptiveness, you design specific layouts for certain screen sizes. You might, for example, want an application to display different features and elements of the site on a tablet and on a phone. For instance, the menu is always visible on a desktop but is collapsed on a mobile device.

Benefits

• Ervaring op maat. De ervaring is in hoge mate afgestemd op specifieke gebruikers en schermgroottes.
• Mogelijk snellere laadtijden. Het is daarnaast eventueel mogelijk om alleen de code voor een specifieke schermgrootte in te laden, waardoor deze op zulke schermen sneller laadt dan een responsive website.

Downsides

• More effort: Separate designs and maintenance for each screen require more effort.
• Beperkte controle. You can’t control the user experience on screen sizes you haven’t developed anything for.

Benefits

• One codebase for several platforms: A PWA requires you to make specific adjustments to your current web application. Subsequently, you only have one version of the app that looks the same on all devices.
• Cheaper and faster to build: Since it contains only one codebase, the application and the mobile version are easier to maintain.

Downsides

• Limited options to use mobile functionalities: Not every mobile platform supports payments through a PWA, and interactions with other applications on the mobile device are limited. Features such as facial recognition and interaction with an NFC chip are not available, either.
• Not (automatically) available in app stores: A PWA is not available in the App Store or Google Play Store, where your users may usually look for your application. However, you can use tools such as PWABuilder to publish your PWA in an app store to bridge this gap.

Benefits

• A native app is built specifically for the mobile platform: This means the application can also make optimal use of the device, so performance is expected to be better.
• Access to device-specific functionalities: You have access to all the device’s powerful features, including the camera, mobile payment options, and the NFC chip. Some of these features have only recently become available for PWAs — at a gradual pace.

Downsides

• Different programming languages: You write an application for Apple iOS in a programming language other than Google Android — Objective-C and Swift for iOS, Java for Android. If you want to develop for both systems, you should employ developers who know the language for those platforms.
• Maintenance: If you develop for both platforms, you also need to maintain the Android and iOS apps separately. That takes a lot of time and energy, as the platforms regularly undergo changes, and you have to make sure your application complies with these.

Benefits

• Access to mobile features: If your app is built using meta frameworks, you have access to many useful features of a mobile device.
• Develop and publish faster: Basically, you create one application that is available for all mobile platforms, as the interface is divided into different components. As a result, the app works optimally on multiple platforms.

Downsides

• It’s more difficult to work with local APIs: Examples include the camera, Bluetooth, or GPS. However, there are solutions, which require extra attention during maintenance.
• Performance: Although this type of app feels virtually native, performance is not as high as that of a native app. So, if your application requires a lot of computing power, a meta framework might not be the best choice. That said, we’re talking about minor differences here.