Mobile application development industry in the last years has multiplied in leaps and bounds, changing business worldwide. With enterprises aligning mobile apps to their productivity in recent times, and with the rapid innovation in mobile devices across platforms, it is necessary to analyze which approach to adopt. Would it be better to take a native approach or a hybrid one? If we are more aligned to adopt a native approach could it be better to use tools like Xamarin, React Native or Flutter instead of develop a 100% native app?
The constant need to move quickly in a market that evolves and changes in a daily basis leads the industry to adapt and deliver products targeting different platforms with a great quality and a polished user experience in a very short time to market.
In the last years there is an interesting growth of frameworks / technologies that try to solve those problems and help the developers towards a successful delivery.
In this article are presented the most important ones with advantages and disadvantages for each one of them. The idea is to help an organization decide the best approach of a mobile strategy that suits it’s needs.
Native
A Native Application is one built specifically for a chosen operating system. Native app development implies using a native language of a device to build an application. If you intend to build an application for iOS, you might employ Objective-C or Swift. To develop for Android, you will be using Java or Kotlin.
One of the benefits of Native development is clearly the User Experience (UX), since Native apps directly access the device APIs and also hardware like GPS, display, CPU etc. so they are faster in execution. This results in an overall better experience for the user of the app. We can also mention the user interface, since this kind of apps have an interface that it’s in-line with the standard UI for that platform as laid down by the company making the OS, like Apple or Google.
Although, not everything is clear and bright on the Native world, one of the problems is a bigger cost of development, since there is the need of having a team specifically for each platform. This results in duplicating the effort and also the codebase for each platform. Also more advanced skills are required for native development, since developers have to really master the OS and APIs to make quality apps happen.
Is advisable to use the Native approach when there is a strong usage of the device peripherals, interaction with other apps on the device is needed, or security is critical. Finally, if the expectation for the UX, animations or overall experience is high, Native is the best solution.
One great example of a Native app is Google Lens, these Google apps allow to interpret images to extract text, understand content on an image and see the surroundings using the camera on the device. It uses Machine Learning and the native APIs provided on Android to analyze the video feed and search or show results.
React Native
React Native uses building blocks to create an app using JavaScript and React, the popular Javascript framework. The outcome is a real mobile app that’s indistinguishable from an app built using Objective-C or Java. React Native uses the same fundamental UI building blocks as regular iOS and Android apps.
This technology has the possibility to write functionality in JavaScript once and share it across iOS and Android, thus removing code redundancy. This allows to have only one team supporting different platforms, therefore the effort to develop an app is reduced. The teams can be better managed and the communication can be improved.
It is also faster to build since it provides numerous ready-to-apply components that can accelerate the process. With the existing base of packages, it can save much time and in the future, it will only get better, since more packages are developed each day.
Another selling point is the simplified User Interface (UI), because React Native is solidly based on creating a mobile-oriented one. In native development, it is necessary to create a sequence of actions in the application, whereas React Native employs declarative programming in which such an order of implementing an action is obsolete. As a result, it is much easier to detect bugs on the paths a user can take.
On the downside, React Native has an impact on navigation. The technology still lacks navigation components to provide users with seamless UX. There is no ideal solution in this case for navigation between displays. It will be getting better and better, but probably it will never be as good and smooth as native navigation. Another thing that’s worth mentioning is also the lack of custom modules. Despite its maturity, React Native still lacks some components. Others, in turn, are underdeveloped. Although, this represents only a minor issue since the majority of custom modules needed are available, well documented and working properly.
This technology also doesn’t remove the need for native developers, required for implementing some native features and modules for each platform. React Native does offer custom modules that you can refactor across operating systems, but things such as access to device sensors, camera or push-notifications require help from iOS and Android developers.
Another thing to consider is Facebook. Facebook puts a lot of resources to ensure React Native is reliable and also to guarantee a constant development of the platform. But you still operate on Facebook’s license and, at the end of the day, you’re always dependent on them. This means Facebook has a right to revoke the license (BSD) to use React and React Native if you get into a patent-related dispute with them.
React Native is recommended when you need a more polished Native UI without having too much duplication of code. Another example is when a React.js development team in already part of the organization. One last case is when a fast build and deploy cycle is needed.
Airbnb is a really good example of “succeed” and “failure”, the lesson learned from it is huge and it worths to read the following post written by one of the engineers at AirBnB. This doesn’t mean that React Native has to be dropped but instead gives a better understanding of what it can or can’t do. Many of the key values described across this article may answer any question in order to adopt or discard this technology. You can read more here.
Another example worth looking is Instagram, where React Native allowed product teams to ship features faster on both the iOS and Android apps. This technology enables them to develop a single codebase and in most features having an 85% or more of the code in a single codebase.
Hybrid apps
A hybrid app is a web application running inside a native container. It’s written using HTML5, CSS and Javascript Frameworks and packed inside a native web view. Both Android and iOS have the means to display that web application. The advantage of this approach is that you build once the web app and with a container for each platform, you can run the same web on different platforms.
One benefit of the hybrid approach is enhancing the UX. With the assistance of the hybrid apps, the users will be able to operate the functions of an app seamlessly. Furthermore, it also helps in updating the app’s content or features rapidly without any inconvenience whatsoever. Also, hybrid apps are efficiently faster in downloading even the largest documents and files in a short time.
When it comes to budget and costs, hybrid apps make use of the assorted libraries and different set of tools for the development process of web pages, this implies fewer development times. After building the app, it’s possible to submit it on the app store and release it in a short time, reducing costs and time spent on development.
Maintainability is another benefit, calculated over time, since there is only one codebase, allowing for less duplication. And also it’s perfect for MVP since it can easily re-utilize the logic and presentation layer of a web page already deployed for the hybrid app.
One of the problems with hybrid apps is that they are middleware dependent (Cordova, Ionic, Appcelerator, etc.) and also, there is a strong dependency to third-party plugins. In case something is not developed, needs to be created from scratch, increasing the numbers of teams/devs and source code maintenance per platform.
The look and feel is also another problem since it’s not native on each platform. UI design applied in the app may look good for one platform but could look ‘weird’ for the other and vice versa. Visual Designers must use common components among the platforms to reach maximum interoperability.
Usually, hybrid apps are recommended when the app mostly has to display information, or there is no heavy use of the device peripherals. Another good use case is when there is the need to quickly port functionality to mobile, and no interaction with other apps are required.
For an example, on hybrid apps, a good case is the McDonalds Turkey mobile app. The American fast food restaurant in Turkey has developed a hybrid application using the Ionic framework. Through this application it is possible to find all restaurants near the user’s location, information about restaurants, view all products an make an order.
Web apps
A web application is a computer program that utilizes web browsers and web technology to perform tasks over the Internet. It’s basically a web page that has been optimized to run on mobile browsers and adapt the content to the screen size.
In the case of web apps, one clear benefit is that they run on multiple platforms regardless of the OS or device as long as the browser is compatible. Also, all users access the same version, eliminating any compatibility issues and you gain the benefit of fast deployment since updates on the server side allow to deploy changes without having to re-publish the app on the Store.
Talking about costs, they are reduced for the business and end users as there is less support and maintenance required by the business and doesn’t occupy space on the end user mobile phone.
On the other side, the clear limitation is that it needs a browser to run. Since it’s a web page, the user has to open the app on the browser. This implies that it doesn’t have the benefit of a specific icon (shortcut) on the user’s device home screen for access it.
They are also much slower than native apps. The performance for web apps are sub-par against native apps and cannot leverage device utilities (the mobile browsers generally don’t have good access to the device peripherals, e.g. GPS, camera or filesystem).
Another problem is the App Store visibility. A company using this kind of apps cannot leverage on App Store / Google Play Store for marketing or brand positioning since it works on a browser, it’s not published in the stores.
On the security side, it relies on code obfuscation to be secure, and you have to use the browser local storage or cookies to save data between sessions. This case is not ideal and insecure.
The best scenarios for web apps are usually the case when a mobile version is needed offering a simpler and pared down experience to the desktop version of the same site. Another good example is the case when porting functionality that already exists on the business web page is needed fast.
If you want a look on how web apps work on the real world, the New York Times is an American newspaper based on New York City, and it uses a web app for displaying content on mobile devices. The online version offers readers around the world immediate access to most of the daily newsletter content. It is possible to read news through all devices without installing any application because of its responsive design.
Cross-Compiling (Xamarin)
Xamarin is a software company founded back in 2011 and in 2016 it was acquired by Microsoft. Xamarin provides a developer with tools that can help them in building cross-platform mobile applications. The applications can have all the native features and also share the common codebase at the same time.
This type of apps benefits from a fast development cycle. The most phenomenal part about Xamarin app development platform is portability, up to 90% of the code can be reused between different platforms, this allows for a clear faster development.
Also, Rapid Mobile App Development (RMAD) for businesses is something that really adds a plus to this technology. Xamarin mobile app development services, hugely appeal to businesses that emphasize modern app development practices due to its RMAD capability.
It has a native user experience since an app developed with Xamarin leverages the native UI components, resulting in a native app-like experience for the end user.
It’s more convenient for form-like apps. To take full advantage of Xamarin benefits and use up to 90% of code sharing between platforms, there is Xamarin.Forms, a UI library on top of Xamarin that allows to almost “code once and run everywhere” and still have a native UI.
A major disadvantage is the inevitable software overheads. Despite the fact that Xamarin is almost as performant as native apps, the code linkage and referencing between target OS environments can imply more startup times.
File size is another issue with Xamarin. While being beneficial in many ways, Xamarin is also slightly accused of swallowing more time for the additional job of adjusting app file size. This is mainly because the generous use of Xamarin’s core libraries and functionality burdens the app stores with unjustifiable app file size.
Open source libraries are sometimes a problem since there is limited access to them. Although it is possible to include native third-party libraries with Xamarin, it can also be time-consuming. Many popular libraries are already installable components, but unpopular ones could get more tricky to use.
With Xamarin, community size is worth mentioning, since it has a considerably smaller community compared with native ones, this means that it is more difficult to find developers experienced with this technology.
The best scenario for Cross-Compiling is the need to build a fast prototype or POC application, but with a native look and feel. If a Form-like app is needed, this technology is also a good choice. Another scenario when Xamarin is good at is when there is a strong .NET team already in place working since they know the basic language.
Captio (a Spain based company that builds an app for capturing expenses) uses Xamarin on his app. With Xamarin they were able to re-use around 80% of the code in the app, delivering an excellent product capable of even utilize the camera for capturing the receipts, prove of the excellent capabilities that the Xamarin platform allows.
Flutter
Flutter is Google’s latest mobile app SDK for crafting high-quality native interfaces on iOS and Android in record time. It works with existing code, is used by developers and organizations around the world, and is free and open source.
Among the benefits is the fact that it is a reactive framework. That means, when it’s used correctly, there’s no worry about updating the contents of the user interface manually. Once there is an update on the variables stated, the UI will reflect the changes automatically.
Another advantage is having one code for 2 platforms. Developers write just one codebase for 2 apps, covering both Android and iOS platforms. This reduces the team sizes needed for developing an app, and the coordination efforts.
One clear problem for this technology is app size since it will almost be considerably larger than that of a native app. Keep in mind also that Flutter is still in beta, The Flutter team hasn’t released the stable version yet. You won’t find any production applications developed with this language, it’s still being developed. Compared to native there is a lot of libraries and support that it is still missing (e.g. background tasks for long-running features).
Overall, Flutter is good for building prototypes on both Android and iOS or if a minimum duplication of the codebase is desirable.
To see how Flutter works in real life, Google AdWords app is a good example. Built using Flutter for the UI, it gave Engineers the chance to share most of the code for the different platforms and create a seamless experience between them.
Another example is the Hamilton Musical app, where the team responsible for it, used Flutter to build it, claiming that they have a 25% increased efficiency on building the app for both Android and iOS. They also estimated the overhead of designing and management of two platforms by 25% less, compared to building two normal apps.
Final thoughts
So far there is not a silver bullet or unique solution that could lead to a successful delivery of a product. There are lots of factors that should be analyzed before making a decision: business needs, deadlines, requirements and even the main skills of the existing development team or even the recruitment possibilities.
Nevertheless, it’s possible to outline general scenarios for each technology:
- Security is critical, strong usage of the Device sensors (camera, GPS, gyroscope), best-in-class UI and experience. Native is the way to go.
- Need for prototyping possible applications or features, looking for a more polished and native UI experience, more capabilities on the device and still have low code redundancy on the app. You should go with React Native or Flutter app.
- Need for fast update times, strong web development team, fast release cycle. The go-to answer here is a WebApp or a Hybrid one.
- Strong .NET team, simple form-like apps, RMAD capabilities, adaptability to change without losing the OS Look and Feel. Cross-Compiling should be an acceptable choice.
Each approach has its strengths and weakness that are very important to know from top to bottom before taking a decision and start developing.
