What's New Features And Improvements In Angular 6

  Apr 05, 2018   AngularJS 3283 Views
Share this article Return

Facebook Twitter Google Plus

What's new Features and Improvements in Angular 6

Angular 6 release is just around the corner which will be the major update from version 5. So we are highlighting some of its new features announced by the Angular Team. In 2017, Angular, one of the most popular JavaScript framework for building mobile and desktop applications, Released two major upgrades in 14 months. It reached the next milestone with Angular 5 arrival on November 1, 2017. The Angular 5.0 upgrade itself centered on making the framework faster, smaller, and easier to use.

Version 6 continues and will focus on being smaller, faster and easier to use but before jumping to the topic let's see some features of version 5.

Angular 5 Key Features 



In version 4.3 was launched HttpClientwithin @angular/common as a smaller, simpler and more powerful way to make web requests in Angular. From this new version, Google recommends using it HttpClient for all applications, and stop using the "traditional" library @angular/HTTP that is marked as obsolete.

Multiple Export Alias

Now we can provide multiple names to your components and directives in Angular 5 while exporting. Exporting a component with multiple names can help your users migrate without breaking changes.

Internationalized Number, Date, and Currency Pipes

Angular 5 has introduced new pipes for numbers, dates and currencies that increase the standardization of the process of internationalization between browsers and eliminate the need to use polyfills to achieve it.

Improved Decorator Support

Angular 5 now supports expression lowering in decorators for lambdas, and the value of useValue, useFactory, and data in object literals. Furthermore, a lambda can be used instead of a named function like so:

Build Optimization
The build optimizer removes Angular decorators from your app's runtime codes thereby reducing the size of your bundle and increasing the boot speed of your application. This action leads to a decreased bundle size and faster application speed.

Check out detail blog post on What's New Introduced In Angular 5

Let's see the important Angular 6 features.

Angular Elements
Angular is a perfect choice for developing Single-Page Applications, creating a widget that can be added to any existing web page was not a simple task. The Angular Elements package will allow you to create an Angular component and publish it as a Web Component, which can be used in any HTML page.
Say there is an existing non-SPA app built using JavaScript and jQuery. The developers of this app will be able to use Web Components built in Angular in the pages of such an app. This killer feature will help the enterprise to switch to the Angular framework for web application development.

Ivy Renderer
Ivy is a new backward-compatible Angular renderer focused on further speed improvements, size reduction, and increased flexibility by making the size of the app smaller and the compilation faster.The Angular Team promises that switching to Ivy rendered will be smooth. This important feature will reduce the code size by gzipped the code which will make compilation faster.

Closure Compiler
Closure Compiler is the bundling optimizer used to create JavaScript modules for almost all Google web applications. The Closure Compiler consistently generates smaller bundles and does a better job in dead code elimination compared to Webpack and Rollup bundlers. In the upcoming releases of the Angular framework, you’ll be able to use this toolchain for building your apps as well.

Bazel Compiler
Bazel only rebuilds what is necessary, it is used almost for all software built at Google, including their 500+ apps developed in Angular. Since source code changes often, it doesn’t make sense to rebuild the entire application for every little change. Instead, we should only rebuild code that actually changed, and code that depends on the changes, With advanced local and distributed caching, optimized dependency analysis and parallel execution, you get fast and incremental builds. So we can assume that this would be the important feature of the incremental build.

Component Dev Kit (CDK)
The Angular Material library uses component dev kit, which provides more than 30+ UI components. CDK allow us to build our own library of UI components using Angular Material. It also supports Responsive Web Design layouts eliminating the need for using libraries like Flex Layout or learning CSS Grid. CDK was released in December of 2017, but the Angular Team keeps improving it.

Service Worker
It is a script that runs in the web browser and manages to cache for an application. Service worker is included in angular 5. In angular 6 service worker comes with bug fixes and additional feature.

Schematics and Ng update.
Angular CLI generates Angular artifacts using the technology called Schematics. If you decide to create your own templates and have Angular CLI explore it, Schematics will help you with this. Staring from Angular CLI 1.7, you can use the ng update that automatically updates your project dependencies and makes automated version fixes. With Schematics, you’ll be able to create your own code transformations like ng update.

Added navigationSource and restoredState to NavigationStart , NavigationStart there is no way to know if navigation was triggered imperatively or via the location change. These two use cases should be handled differently for a variety of use cases (e.g., scroll position restoration). This PR adds a navigation source field and restored navigation id (passed to navigations triggered by a URL change).

Language Service
The 2.6 version of Typescript’s “resolveModuleName” started to require paths passed to be separated by '/' instead of being able to handle '\'.

These are few changes included in Angular 6

  • Typescript 2.7.x supports
  • Improved decorator error messages
  • Fix platform-detection example for Universal
  • Added to supports of Native-Element
  • Added Optional generic type for ElementRef
  • Updates on NgModelChange
  • Add type and hooks to directive def
  • Enable size tracking of a minimal CLI render3 application
  • Add canonical view query

we are looking forward to these features that will make Angular 6 even better than it's previous versions, but what else could be improved, Angular CLI is a great tool, but it has major dependencies on the third-party software. Several times we’ have experienced broken builds in the latest releases of Angular CLI that were caused by some erroneous release of a third-party package.The Angular CLI folks are pretty good at releasing patches when errors are reported, but the process of regression testing should be improved, so these errors wouldn’t even sneak in.


The Angular team has started providing the regular updates from the version 2 and these are few details about the angular releases in previous years.

Angular Versions

Team Angular is working really hard for the newer version of angular and it would be a major update. Angular 6 RC phase has begun. Angular 6 stable version should be released pretty soon. As per official schedule, Angular 6 will be released in the mid April 2018. Version 6 continues an emphasis on being smaller, faster and easier to use improved the AngularJS Development to a great extent.

Check Our Latest Blog on 20 Best AngularJS Development Tools For Developers

Share this article

Facebook Twitter Google Plus

We strive to deliver solutions highest level of consistency in performance and quality

Call us today on +91 9096932144 or email at sales@angularminds.com

Contact us