Ionic Mobile Application Development 4.0

Ionic has always been a prominent technology for developing hybrid apps, but this year marks a key milestone in the framework’s evolution. The new version, 4.0, introduces an array of new features and capabilities, and begins to shed the shackles that previously made it hard to partner Ionic with frontends other than those developed in Angular.

As the latest release heralds a new generation of apps built on the Ionic framework, we take a look at what Ionic development 4.0 could look like for your enterprise, and why it is a major contended when it comes to releasing a hybrid or progressive web app (PWA).

This year marks a key milestone in Ionic’s evolution

A Brief History of Ionic

Of course, in emphasizing what’s new with Ionic, it only makes sense to first touch briefly on what came before. After all, Ionic development teams have managed to build highly functional and successful apps ever since the very first release.

That first release arrived in 2013 and was built on top of AngularJS and Apache Cordova. Its popularity in mobile app development services was assured because aside from being open-source, it enabled developers to build apps for any platform using a single source code, offered a plethora of native device features, and was focused on functionality.

None of that has changed, and successive releases have improved solidly on the initial offering, not least by being built on Angular’s web framework instead of AngularJS. Even before these improvements though, Ionic development was on a steady upward trajectory.

From ‘Ionic for Angular’ to ‘Ionic for Everyone’

If Ionic ever had a drawback, it was the fact that it was primarily a mobile UI framework, made up of an SDK tightly interwoven with AngularJS and, in later versions, Angular 2+. Building an app with Ionic, therefore, required developers competent in the use of Angular, a tool with a steep learning curve and multiple optimization paths.

Without Angular, an app built with Ionic would be rudimentary at best, but that is the one thing that has changed in 2019. Ionic is no longer “Angular for mobile.” In its new guise, it is framework-agnostic.

If you have plans to build an enterprise or consumer app with an Ionic development team today, the introduction of web components in Ionic 4 and the ability to work with any frontend framework make a far more persuasive case for doing so than in the past.

If that’s not enough, you might be persuaded by the recent release of the Ionic Enterprise Edition, which offers full support for teams building mission-critical apps. The Enterprise Edition, of course, comes at a cost. Prices for the package are customized for each customer, but you can expect them to be somewhat higher than the small-business-oriented Growth Plan, which costs $120 per month according to Ionic’s pricing.

Ionic is no longer Angular for mobile. In its new guise, it is framework-agnostic

Ionic Development 4.0: What’s New?

We’ll return to Ionic’s Enterprise Edition a little later in this article, but for the moment, let’s focus on the new features and capabilities Ionic 4 can bring to the developer’s table.

Keen to stress the breakaway from dependent associations with Angular, the Ionic team have dubbed the new release Ionic for everyone. Indeed, the graduation to web components as a successor technology to the Angular suite used in previous versions is perhaps the most significant game-changing feature of Ionic 4.

Web Components: Ionic Democratized

In previous iterations of Ionic, the entire product primarily comprised Angular components, which meant that if you wanted to create a mobile app, you would need to create a web app first, then wrap it using Apache Cordova.

Now, thanks to the Ionic 4 overhaul, the dependency on Angular and Cordova no longer exists. Your development team will be able to create web apps using Ionic’s web components in conjunction with any frontend framework or without any framework at all. Once you have the web app built, you can convert it into a near-native mobile app using Ionic’s technology without the need of a Cordova wrapper.

Simply Lighter, Faster, Better Apps

Democratization is not the only benefit of introducing web components to Ionic. Other advantages include simplicity of development, since web components reduce the amount of coding required to build apps and improve performance, as they also enable an app to be lighter and respond more quickly than one created with Angular. According to a recent press release by Ionic, the new version achieves the Google Lighthouse score of 100/100 for application speed and general performance.

An increasing number of browser applications supports web components, but even for the exceptions Ionic has an answer. The framework simply polyfills those browsers that are not yet replete with web-component support.

Cordova Dependency for Mobile: That’s a Wrap Too

Just because you don’t have to use Angular components in Ionic development anymore doesn’t mean you don’t want to. The good news is that you can still do so if you wish. The same is true when it comes to app wrapping. Your team is free to use Cordova to wrap web apps, but you might wonder why you would when Ionic’s new solution, Capacitor, will do the same thing via a more straightforward process.

Ionic describes Capacitor as “the native bridge for cross-platform web apps,” and apart from easing the task of wrapping, its other main advantage over Cordova is that it has implementations for the web, as well as for iOS and Android.

More Upgrades and Improvements

Other changes arriving with Ionic 4 include:

Improved CLI for even faster apps (as illustrated in the image above)
Official Angular tooling added to replace Ionic tools
New official Ionic icons
Native API upgraded and made framework-independent
Addition of CSS variables to each component
Revamped documentation

When you consider these upgrades and improvements collectively, it’s quite clear that in its 4.0 incarnation, Ionic has all but reinvented its product.

Ionic 4 will give greater flexibility to commercial development teams and make it possible for any developer to create amazing apps without the need for Angular expertise. However, for larger enterprises, the good news doesn’t stop there: along with Ionic 4, this year has seen the arrival of the platform’s new Enterprise Edition.

Ionic 4 will give greater flexibility to commercial development teams

Ionic Development for Enterprise

With Ionic 4, it’s not only possible but extremely practical for anyone with web coding skills to build a fully functioning, near-native mobile app or a PWA. For solo mobile development entrepreneurs and small businesses, it’s even possible to do so without paying a penny in licensing fees, as Ionic’s free version offers just about anything that a development team could need.

For larger teams and growing enterprises though, Ionic extends the range of tools available with its Growth Plan, and this year added a further level of professional support with its Enterprise Edition. The latter solution is likely to be of interest if your company is planning a complex web or mobile development project or is building several apps concurrently.

Ionic says that its Enterprise Edition provides all that’s necessary to build full-stack applications, with the additional benefit of professional support—but what does that mean exactly? It is a question probably best answered by looking at what you get for paying a sum of money that’s undisclosed until you make contact with the Ionic sales team.

What’s in the Enterprise Edition?

In summary, the enterprise package includes:

The Ionic UI framework
An extensive library of customizable components
Managed integration of Cordova plugins and platforms
Customized service level agreements
Immediate attention to development issues
A dedicated customer service manager
Prebuilt solutions for biometrics, user authentication, offline data storage, mobile payments, barcode scanning, and communications

All of the above is included in the custom price that your company negotiates with Ionic, and if it’s any indication of what that price might be, you can at least see the cost of some of the add-on services available. For instance, according to the Enterprise Edition pricing page, you can avail of a backend and third-party integrations service for an additional $5,000 (minimum) per year and assisted development for $24,000 per year and upward.

Does your business need this level of support? That’s a tougher question to answer, but with Ionic 4 offering the ability for developers to work with any framework, full enterprise support might not be such a critical need as it could be for previous Angular-dependent versions of the software.

Ionic 4 allows developers to work with any framework, so is full enterprise support such a critical need?

Find the best team for your hybrid development project

Get a free consultation

So… Should You Try Ionic Development 4.0?

Whether or not you have the budget for all the Enterprise frills and extras Ionic has on offer in 2019, the question to answer first is “why Ionic?” After all, it’s not the only cross-platform development tool available, and in terms of overall popularity, it’s not at the top of the heap.

As you can see from the image above, Ionic still has a long way to go before the number of package downloads come close to those of React Native. Similarly, according to the statistics from AppBrain, Ionic apps represent just 0.28% of overall mobile app installs, compared with more than 3.8% for the React framework. Of course, Ionic 4 is so new that it’s hardly had an opportunity to gain its market share, and it will be interesting to see if the balance will shift in its favor as time goes on.

Project Considerations (What Are You Building?)

So what types of projects are best-suited to Ionic development? If you are planning a straightforward web app, you may not need Ionic, although it is fit for the task. On the other hand, if your app needs to be compatible with multiple mobile platforms and with web browsers, you’ll be right in the middle of the Ionic comfort zone. It’s a framework for cross-platform development, so when building cross-platform apps you’ll be able to extract maximum value from Ionic.

That said, like all tools, Ionic 4 has its limitations, and if you plan to develop an app that will require high-quality 3D graphics, for instance, you should probably look elsewhere.

Team Considerations (Who Is Building?)

A year ago, we might have suggested that the makeup of your development team should be a critical consideration when deciding if Ionic is the best framework for your project. However, with the arrival of Ionic 4, developers’ skills become somewhat less of a concern.

As long as you have a team that’s familiar with JavaScript, you should have no trouble, and the Ionic community is an excellent source of help and support, not least since it’s home to Angular development gurus as well as the Ionic faithful. Add the fact that Ionic’s documentation is second-to-none where clarity and user-friendliness is concerned, and you have a compelling reason to pick Ionic 4 for your team to work with even if you don’t have the most experienced developers onboard.

Finally, if you are planning to develop a PWA, choosing Ionic 4 is perhaps something of a no-brainer at this point. In the final section of this article, we’ll explain why.

What types of projects are best-suited to Ionic development? Let's take a look

Possibly Perfect for PWAs

Progressive web apps look set to be the next big thing in the cross-platform domain, with some pundits suggesting that they may even overtake and become the de facto successor to native apps and the mobile web. In Ionic’s 2017 Developer Survey results, 31.5% of participants said they were targeting progressive web apps.

The rise in PWA popularity is understandable, as potentially they offer everything a native app can deliver and more. For example, progressive web apps have the advantage of discoverability, since they don’t need to be searched for and downloaded from an app store.

As PWAs gain traction, it’s likely that more and more enterprises will see the opportunities they offer for growth. If you’re planning for your business to be an early adopter, Ionic 4 is worthy of serious consideration as your development framework of choice.

PWA-friendly Features

The following summary highlights the features and characteristics of Ionic that make it eminently suitable for PWA development:

It uses industry-leading APIs and web standards.
UI components in Ionic are flexible, which is critical for a responsive PWA.
It’s easy to apply service workers to Ionic apps, so users can access them when offline.
Setting up push-notifications is simple and straightforward.
Changes to the router in Ionic 4 makes it easy to share apps via a URL.
Because it is a mobile-first framework, and can be adapted to all platforms, PWAs built with Ionic 4 are akin to native apps in their look and feel.

If you have some knowledge of PWAs already, you’ll recognize the features above as collectively meeting most of the requirements to build one. Better still, you have a choice of building with Ionic straight out of the box, integrating with another framework such as Vue or React, or leveraging the incumbent Angular capabilities.

Ionic 4 is worthy of serious consideration if you plan enterprise-level PWAs

Will You Get Progressive With Ionic Development 4.0?

While its creators may be calling it Ionic for everyone, no development framework is 100% suited to a given scenario. Nevertheless, if your project calls for cross-platform app deployment on a limited budget, and especially if the objective is a progressive web app, Ionic 4 is a contender you shouldn’t overlook.

If your financial limits aren’t too restrictive, you might even consider the custom-priced Enterprise Edition, but you might first want to ask your team if the extra whistles and bells are a necessity or just nice-to-haves.

All in all, a decision to develop with Ionic 4.0 will never be a bad one. Furthermore, if you want to get your app to the market in the shortest possible timescale and without the costs of building versions for each platform, there may be no better way to do so than with Ionic’s groundbreaking fourth-generation release.

Decision to develop with Ionic 4.0 will never be a bad one

Ionic Development 4.0: A Step Forward for Enterprise PWAs?