A CTO's guide to developing hybrid mobile applications using Ionic

At Roller, we have worked with Ionic on several mobile application projects over the last few years. Recently we have seen a huge spike in the growth of the Ionic development community and its popular demand increasing in the industry. As a relatively new framework, we wanted to give you our insight and experience in using it as a development tool.

Read below our pro's and cons to using the ionic framework for building hybrid mobile applications. For more information get in touch with our team, who are always on hand to offer friendly and informative advice.

Background on the Ionic Framework

Ionic was launched in 2012 as a free open source HTML5 software development kit (SDK), aiming to further empower developers to build a mobile web app that provides a native experience. Typically known as a ‘hybrid’ app, with web technologies like HTML, CSS and Javascript, the Ionic framework is used, alongside the popular Javascript library AngularJS, to develop the front-end User Interface (UI) layer that sits on top of a Cordova code base.

Cordova applications use CSS3 and HTML5 for their rendering and JavaScript for their logic, which means they use a web view for layout rendering but also able to have access to native device APIs and functionality when paired alongside Cordova plugins.

So as long as a development team understands the basics of Javascript and AngularJS, alongside Cordova, they will be able to utilise Ionic for a project.

Native vs Hybrid

We have written plenty of articles surrounding the debate of native vs hybrid app development, which can be found below, but to in order to give a complete picture in this article we will briefly cover it again.

https://rolleragency.co.uk/blog/native-app-web-app-our-guide/

https://rolleragency.co.uk/blog/development-choices-web-hybrid-native-apps/

Our development team are strong believers in building traditional native applications, however, they also believe in utilising the technology stack that best suits the nuances of the individual product to ensure the best delivery for the project in hand. The key benefit we have often found in developing hybrid apps is that existing web teams can build high-performance apps that can run on any device, allowing a new layer of autonomy for businesses.

With native application development, entirely separate code bases are required to be developed in conjunction, which means that in general, a cross-platform native application project can be more timely and expensive than developing a hybrid or web app.

The brains behind the Ionic framework declare that hybrid apps seemingly get the best of both worlds, utilising a single codebase and using plugins to tap into the native functionality. However, because a hybrid app is running a webpage in a webview hosted inside a UI native ‘wrapper’, it can be slower due to page loading, and provide a less intuitive experience than a native app, especially with performance-intensive applications.

What We Enjoy About Building in Ionic

Our development team enjoy the benefits of utilising Ionic when developing hybrid apps for a number of reasons. Ionic gives the development team access to UI elements (filters, forms, navigation menu, list views, tab bars etc) that make the app look nearly as good as a native app, which was historically the problem with developing hybrid apps in the past.

The Ionic fan base and community is growing and therefore has a large network of developers who are using the framework. There is a 20,000 registered users Slack channel full of qualified and informed developers who are on hand for daily support when faced with challenges surrounding the framework. Having a thriving community can often make or break a development framework and the Ionic community seems to be growing from strength to strength.

Ionic have also realised Ionic Pro which gives access to a suite of tools that allow apps to be developed with the Ionic framework quicker and easier than ever before. Rapid prototyping, real-time app updates including error monitoring and app-store compilation packages give developers additional tools to speed up the development process. It is also has a relatively cheap subscription model which is always an added bonus!

Because the technology is all web, it means you can use the same code base and develop a Progressive Web App (PWA) later down the line. This allows you to run your app inside a desktop browser allowing for more innovative product innovation down the line.

It should also be noted that native apps can be only be downloaded via the app store, whereas hybrid apps can be distributed via desktop browsers, desktop apps, mobile browsers and the app stores, giving a broader distribution scope for commercialisation.

The Challenges We Have Faced

Working with Ionic and Cordova notoriously is not without its problems. With several different layers of web technologies stacked up against each other, there is a pressure of having multiple dependencies that all rely on each other to work. Ionic has its own plugins called Ionic Native, which can be used alongside Cordova plugins, that tend to be harder to use. Because the developer can be reliant on this, it can prove to be a more challenging process, that has the potential to slow progress. This is especially the case when complicated functionality is required because as bugs arise they become reliant on the external provider to create a patch or have patches developed by the team themselves. This again may slow progress and cause unexpected delays in a project.

Overall, we believe that Ionic is an exciting and innovative framework to use for projects that require rapid development, a need to be used across multiple platforms plus a desire to look and feel like a native application without overly complicated functionality. At Roller, we choose the framework that suits the project in hand. However, for time, speed and transferable efficiency, we are big advocates of the Ionic framework.

If you would like to chat to us about your next app development project, please contact us at info@rolleragency.co.uk.

---

Posted from my blog with SteemPress : http://rolleragency.co.uk/blog/ctos-guide-developing-hybrid-mobile-applications-using-ionic/

---