Ionic recently announced a beta release of version 4 of their framework for building mobile web applications. Ionic 4 focuses on improvements to performance and a more framework-agnostic approach by focusing on support for the web components standard.
Ionic initially focused on being a mobile framework for Angular, and while Ionic still works well within this capacity, the renewed focus on custom elements and shadow DOM help Ionic support a variety of other frameworks seamlessly including React, Vue.js, and Dojo.
Version 4 is a rewrite from the ground up, using standard Web APIs with the goal of keeping the core of the framework future-friendly by relying on the APIs that browsers support natively. Per Ionic co-creator Adam Bradley, "We never want to have to rewrite Ionic’s components ever again." The Ionic team created Stencil, an open source build tool to help convert components from various frameworks into web components. Ionic supports polyfills for browsers that do not natively support web components, without the overhead of including this code for browsers that include native support out of the box.
While the Ionic team now supports many other frameworks, they have made significant efforts to support Angular users. Per Bradley:
For those using Angular, this means very little will change. Most of the APIs and tags continue to work as an Angular developer would expect, and Ionic’s core Angular services work just like they used to. We’ve worked hard to keep the experience for Angular developers largely the same.
Ionic 4 supports the Angular CLI and Router for Angular users. The Ionic team provides a migration tool to migrate from Ionic 3 to 4.
Ionic CEO Max Lynch shared his thoughts on the direction of Ionic with InfoQ:
At a high level, Ionic 4 represents our renewed focus on open web standards and technologies. Like most frontend teams, we've experienced the intense uncertainty and high costs associated with technology churn on the frontend. We see focusing on exciting new web standards such as Web Components as a way to build some long term API stability, while also expanding the potential reach of Ionic's open source technology.
Going forward, a web developer will be able to use Ionic's components no matter what frontend framework they choose to use (or none at all!) While we are still ardent supporters of Angular, we are excited about React, Vue, Polymer, and even jQuery developers being able to build cross-platform apps with Ionic.
We find the siloing of the frontend developer over the years to be a great tragedy, resulting in an incredible amount of redundant work by component, library, and app authors. By moving to an accepted standard component model, we hope that we can put those days of component incompatibility and siloing behind us.
The framework agnostic vision of Ionic is similar to that of Dojo and Svelte, in attempting to reduce the reliance and silos introduced by frameworks.
Mobile developer Josh Morony created the Ionic 4 migration survival guide, and remarks that:
In my view, the migration from Ionic 3 to Ionic 4 is the most significant in the frameworks history, and it sets a course for Ionic that likely will not be deviated from for years to come. I say significant in the sense that it is of great importance/benefit, the actual work required to transition from Ionic 3 to Ionic 4 is much smaller than that of previous updates to the framework.
The release of Ionic 4 does bring about some exciting new features, and greatly expands the possibilities of what is possible with Ionic. Although the upgrade process does not change nearly as much as has been changed in previous updates, it will still likely take a bit of time to understand the changes and then implement them.
To get started with Ionic 4 beta, follow the Ionic installation guidelines. Ionic is open source software available under the MIT license. Contributions are welcome via the project's GitHub repository. New contributors are encouraged to read the Ionic contribution guidelines.
