1- Web component
2- Navigation
3- Capacitor
4- Progressive Web Apps
As we mentioned in our last article, Ionic 4 has made many changes and improvements that are much appreciated by developers of hybrid mobile applications. These improvements mainly concern performance, development time and themes, which are more complete and powerful. The new Ionic is compatible with a larger number of js frameworks, not just Angular.
In this article we will detail the four main differences between Ionic 4 and previous versions of this free and open source framework.
1- Web component
Web components are sets of web platform APIs that allow you to create custom HTML tags that can be reused in web applications and pages. They can work in the same way in all environments, for example React, Ember, Vue or Vanilla JS.
The Ionic team rebuilt the user interface elements as web components using StencilJS. These elements can be used independently of a Javascript framework.
2- Navigation
One of the main improvements introduced in Ionic 4 concerns navigation and routing. The Ionic team has decided to move away from push/pop mobile navigation and now supports native angular routing, with some modifications as the preferred navigation mode. However, push/pop navigation is still supported in Ionic 4.
3- Capacitor
Ionic has always provided you with the tools to transform your web applications into native mobile applications. Previously, it used Apache Cordova as a mobile web wrapper (which you can still use in version 4), but the Ionic team also worked on its own Capacitor solution.
Capacitor offers many enhancements that are particularly suited to hybrid/PWA development in Ionic. It comes with a rich standard library of features such as camera and file system access for easy integration of native features into Ionic applications.
4- Progressive Web Apps
Another objective of Ionic 4 is to provide ready-to-use support for the creation of high-performance progressive web applications (PWAs). Thanks to the complete redesign of the framework’s user interface components using Stencil Ionic 4, you can now benefit from smaller file sizes and increased performance (Shadow DOM and HTML imports), as well as lazy loading components.
The icing on the cake: the Ionic Framework team has written very detailed documentation covering the migration steps. This process is quite simple and does not generate any problems. Migrating from Ionic 3 to Ionic 4 does not mean rewriting your application (as was the case during the migration from Ionic 1 to Ionic 3).
As we have seen, Ionic 4 has delivered on its promise to improve flexibility, performance, speed and development speed. The Ionic 4 team did an excellent job. Developers are taking a big step forward as Ionic can now focus on what it does best: being an efficient user interface.
+33 1 76 40 03 53 
