Ionic Framework V4 focuses heavily on speed, compatibility, and general extensibility. The following are the new features in Ionic 4.
Web Components : One of the most significant changes in Ionic V4 is that each component is now a web component. A group of web platform APIs is known as web components. It enables developers to construct customised and reusable HTML tags for usage in web pages and web applications. Custom elements, HTML imports, HTML Templates, and Shadow DOM are the four key requirements.
Capacitor : It's a cross-platform API with a code execution layer that makes calling Native SDKs from web applications simple. It also creates any custom Native plugins your application may require. It also allows the developer to create a single application and distribute it across application marketplaces and mobile websites.
Stencil : The ionic team has produced a new web component compiler to create standards that are compatible with web servers. It also makes use of extra APIs that are best suited for PWAs, such as TypeScript, Virtual DOM, JSX, and async.
Ion-Backdrop : They're full-screen components that overlay other components. They are used to dismiss the other component and are placed on top of the other component.
Ion-Picker : On the top of the application content and at the bottom of the viewport, it shows a row of buttons and columns.
Ion-Ripple Effect : The ripple effect is a component that adds the ink ripple interaction effect from Material Design. It's designed to be fast, non-intrusive, and easy to use without adding any more DOM to the elements. For CSS-Only implementation, it works without degrading JavaScript.
Ion-Searchbar : This component consists of a text field that is used to search a collection. In version 4, the Ionic team has implemented nine alternative search bar designs.
Color changes : The Ionic framework's default colour has been modified, and several new default colours have been introduced.
CSS Variables : These are the Ionic framework's highlighting features. Without utilising the build tools, it will change the entire appearance and feel of the programme by making minor changes to a few variables.
Lazy Loading : It is a design approach used in the Ionic framework to delay component initialization until it is required. By breaking the application into numerous bundles and loading it on demand, it improves performance and reduces application load time.
