Facilitating the Spread of Knowledge and Innovation in Professional Software Development

Write for InfoQ


Choose your language

InfoQ Homepage News Ionic 2 Brings Performance Improvements and New Native Plugin System

Ionic 2 Brings Performance Improvements and New Native Plugin System

The Ionic team has released version 2.0 of its JavaScript framework, bringing with it new components, features, and tools, including a new native plugin system.

In the blog post Announcing Ionic 2.0.0 Final, Ionic co-founder Max Lynch describes how the Ionic team worked closely with the Angular team "to build the next generation of Ionic Framework" on top of Angular 2. While Lynch says it was "rough going" at points, the decisions of the development team along the way have been vindicated, with Ionic apps benefiting from a significantly faster Angular 2, giving them an "inherent performance improvement out of the box."

Among the most significant of the improvements in version 2.0 of Ionic is built-in error handling and debugging features.

Ionic 2's first RC release had a new build toolchain called App Scripts for building, testing, and running apps. With the final release, new error handling and debugging features are built in to the application. Lynch says:

When a compile error is introduced while developing, using the ionic serve command, details of the error will be shown directly in your browser window. This feature is extremely useful for helping track down issues with code and keeps you focused on development instead of switching back and forth to the terminal.

In the performance improvements, Ionic 2.0 now scrolls with 60FPS on Android and iOS, replacing JavaScript scrolling. Lynch says Ionic's Virtual Scroll implementation helps developers to build apps that are able to scroll through very large lists with only a minimal performance hit. Also new to Ionic 2 is a rendering pipeline that helps to reduce layout thrashing and repaints, by only redrawing changed portions of their view.

The community's reaction to the final 2.0 release of Ionic has been positive. In the Hacker News discussion around the release, user jbmorgado asked "I was really very well impressed by the small size of ionic apps. It's in the order of ~3MB which is great. But the startup times are somewhat big. I'm talking, for the simplest of applications a startup time of ~5.5 seconds in ionic 2 (the beta) vs ~2 seconds in React Native in Android. For me, that detail has a significant impact in usability. Any plans to work on those startup times?"

Justin Willis from Ionic replied:

Start up time is something that we are very focused on at the moment. Especially on the PWA side of things, TTI (time to interactive) is exceedingly important to ensure a good user experience. We are working on a few things at the moment but most likely the first one to hit is gonna be code splitting. So with code splitting, instead of shipping just one big bundle you will be shipping smaller bundles that are lazy loaded based on routes. This means that when the app first loads only the first bundle for the first view in your app will have to be loaded, parsed etc and then the other bundles will be lazy loaded.

Developers wanting to use Ionic 2 need to update to the latest CLI with npm install -g ionic, and start a new project with its Getting Started guide. It is important to note that Ionic 2.0 currently requires Angular 2.2.1, and prevents a prod build with any newer version of Angular. At time of press, the Ionic team hadn't yet confirmed if it will be supporting Angular 2.3 or progressing directly to Angular 4.

Rate this Article