Ionic has always been seen as mobile for angular rather than a proper hybrid mobile framework but has that tag changed with the introduction of Ionic 4 series? Let’s find out.

Ionic started as a JavaScript-powered framework playing piggyback on AngularJS for building quality mobile apps with familiar web technologies. AngularJS improved and moved ahead in terms of versions and features. Angular 2 was born, and Ionic had to jump ships as well, and Ionic 3 happened which has been the most successful version of Ionic till date.

Coming to senses in 2019, Angular has grown, even more, React has jumped the bandwagon and so is Vue. Till Ionic 3, it has been embraced well by Angular developers, but how about others? Thus, came in Ionic 4 with a tagline “Ionic for Everyone”.

Everything for everyone

Starting from Ionic 4, the Ionic framework as such is distributed as a set of Web Components which can be understood by every modern browser available out there. So Ionic can be used by all sorts of developers to ship out apps for mobile, desktop, and Progressive Web Apps (PWA). As a part of standardization, Ionic now targets standard web APIs. This makes Ionic shed the “mobile for Angular” tag.

Ionic CLI

Ionic CLI 4.0 has gone through many changes which have made it feature-rich, enhancement in speed and ease of handling. This new update, in conjunction with Angular CLI gives the developers more freedom in developing Ionic apps.

Customization

The most significant change that Ionic has seen is the usage of native CSS Custom Properties (CSS Variables), in each component.

Framework tools

Ionic has started to focus more on its core strength by offloading the tools part for building, bundling, and routing to the framework that the developer use such as Angular CLI when using Ionic with Angular, Vue CLI with Vue.js, etc. Ionic has moved to BYOF (Bring Your Own Framework) model because everything from Ionic UI controls to native CSS to Web Component APIs has been standardized for good and it can work with most frontend frameworks like Angular, React, Vue, etc.

Navigation

Ionic 4 uses Angular Router, which is a welcome change; The navigation and Router have gone through many changes which are aimed at simplicity. Achieving parallel navigation inside the application is now possible using the Ionic framework instead of traditional linear app navigation.

Performance

Performance has got a boost which comes built-in. Lazy loading design pattern, which is a part of Ionic performs on-demand components initialization, this, in turn, increases performance and reduces application load times. Ionic claims that this is the fastest Ionic that has been shipped out till date with claims of 1.5 times performance difference from Ionic 3. Now Ionic has become easier to work with, and it is already future-ready.

Other areas

Ionic has introduced Capacitor as an optional alternative to Cordova. Users can now choose between Cordova and Capacitor when creating new Ionic projects in the CLI. The new Native API Container makes building apps that run on iOS, Android, Electron, and on the web as PWAs easy and of course with complete access to the native functionality of the respective platform.

Stencil 1.0 (Stencil One), an all-new compiler architecture is in its beta stage as well which is capable of better optimizing the components and being future-ready from the word go.

Ionic 4 updates are being shipped periodically, which addresses enhancements and performance tuning. Ionic 4.4.0 (Beryllium) is available at the time of writing.

There are much more nuances that make Ionic 4 series a compelling and full-fledged package to be used by all kinds of developers for their apps with ease.

Reference(s)

  1. https://ionicframework.com