Facilitating the Spread of Knowledge and Innovation in Professional Software Development

Write for InfoQ


Choose your language

InfoQ Homepage News Angular 4.0 Released with a Focus on Shrinking App Size

Angular 4.0 Released with a Focus on Shrinking App Size

Google has released version 4.0 of their popular Angular JavaScript framework, focusing on shrinking the size of the generated code and keeping the framework on a streamlined release schedule.

Because Angular switched to using Semantic Versioning, the release of version 4.0 is not as big of a deal as the release of version 2.0. It just means that there are breaking changes that developers will need to watch out for. Thankfully, these breaks are tame, and don't require relearning the entire framework. "Most developers should be able to simply update their dependencies and rebuild," says Rob Wormald, an Angular team member.

There was no version 3. Angular skipped to version 4 in order to sync up the Angular router's version which was already in 3.X.

There are plenty of new features, most of which are small. One of the biggest improvements was in the way Angular's Ahead-Of-Time (AOT) compiler generates code. In a design document, Angular Team Member Tobias Bosch wrote that a sample template that only took up 245 bytes of source code was compiled into 7,951 bytes of TypeScript code- 32.5 times bigger. While the use of the AOT compiler has a positive impact on Angular performance, the payloads delivered to the browser were large. In his prototype, Bosch was able to get the compiled TypeScript code down to 1,833 bytes; 7.5 times bigger than the source but less than 25% of the original results. In the version 4.0 announcement post, Google wrote that developers should see a dramatic improvement:

We’ve made changes under to hood to what AOT generated code looks like. These changes reduce the size of the generated code for your components by around 60% in most cases. The more complex your templates are, the higher the savings. During our release candidate period, we heard from many developers that migrating to 4 reduced their production bundles by hundreds of kilobytes.

On Hacker News, developers wrote that "upgrading from v2 to v4 has been painless" and Angular developer Cory Rylan told InfoQ "it has never been a better time to try out Angular. The performance improvements have been astounding!"

This version of Angular has also made the TypeScript jump to version 2.1. Previously, TypeScript 1.8 was used and there was no backwards compatibility. Other important changes are:

  • Animation pulled to its own package
  • Angular Universal (server-side rendering) is back in sync with Angular and is now maintained by the Angular team
  • Source Maps for Templates
  • Improved *ngIf and *ngFor

With this release, the Angular team has fulfilled the commitment they made to release every six months. The next major version bump (to 5.0), should arrive sometime in September of October of 2017. The full release schedule is available on GitHub.

Rate this Article