Angular 8.0 Released in May 2019. Yes, we are talking about the new features of Angular new version !!
What New features in Angular 8?
Compared to Angular 7, there are a whole lot of performance and workflow improvements in the latest version of Angular 8, along with other goodies like CLI APIs, differential loading, web worker support, and more.
This major release spans the entire platform and aligns it to the ecosystem. It covers the framework as well as Angular Material and goes on further to improve application loading speed on modern browsers.
With smaller bundles and higher-order components, you can expect better debugging and quicker compilations without the need to repeat codes.
Some important highlights of Angular 8.0 :
Default Differential Loading :
Browsers will select optimized or legacy bundles according to their capabilities and load the correct one automatically. Also, users will receive the bundle they require.
Overall, this will contribute to the build process and speed up applications via modern syntax and a smaller amount of polyfills. The loading speed of modern browsers will get a boost and Time to Interactive will turn quicker. It is amazing how on modern browsers, differential loading can save up to 7-20% in bundle size on an average.
Improved Support for Web Worker Bundling :
When you are into CPU-intensive tasks, web workers are the best way to speed up application and improve their parallelizability. They write code off the main thread and offload tasks to a separate background thread.
Now, the new improvement is kind of refreshing. Angular 8.0 enables fully parallelized web worker bundling without the aforementioned awkwardness. This is also a big relief for front-end developers who previously struggled because of single thread limitations.
Opt-In Usage Sharing :
This is yet another interesting addition to the Angular CLI which seems like an effort to align Angular 8 with the community needs. With this, the open-source web application framework will collect anonymous data only when allowed to.
Information such as commands used and build speed will help Angular keep a tab on how developers use the platform and how more improvements can be brought about. This is also your opportunity to share telemetry about CLI usage with your developer team.
This is a commendable effort, where Angular has emphasized on consent about data sharing so the development tool can be improved. Most other platforms collect data by default on an opt-out basis and stop only when you command them not to. Yet others don’t even allow you to ask them to stop sharing telemetry. To that end, Angular has found the correct way to do it!
Support for TypeScript 3.4 :
Angular 8.0 has not only welcomed TypeScript 3.4 but also mandated it. In other words, you will now have to update your TypeScript version without failing.
Dart-sass for Sass Files :
Yes, Angular CLI has ditched node-sass for dart-sass to create your Sass files. This would now be the reference implementation replacing Ruby – the legend. Dart is believed to be super fast almost to the point of notoriety.
Although the generated Sass files should remain unchanged, there are chances the compiler might become a tad stricter. Also, with fibers, the speed could double.
Builder APIs and Workspace APIs in the CLI :
The new Builder APIs will let you tap into ng build, ng test and ng run much like Schematics let you tap into ng new, ng generates, ng adds and ng update. This will help you with processes such as build and deployment using third-party libraries and tool.
This apart, Angular is also working toward leveraging the cloud for APIs. The latest AngularFire, for instance, adds a deploy command, simplifying the process of build & deploy to Firebase.
ng add @angular/fire
ng run my-app:deploy
Updates in ViewChild and ContentChild :
Earlier, ViewChild and ContentChild were two nasty, inconsistent things. They were implemented so components could request elements that were not in a structural directive, such as ngIf or ngFor.
The query result for the same was ready in ngOnInit or accessed by the program code in ngAfterViewInit or ngAfterContentInit.
Also, for elements exclusively loaded later into the DOM because of data binding, the code had to insert either ngAfterViewChecked or ngAfterContentChecked. Needless to say, all this was extremely confusing.
Advancement in AngularJS Migration :
Users of the $location service should rejoice because Angular now enables a LocationUpgradeModule in AngularJS applications, which translates to a unified location service.
The latter smoothly shifts its responsibilities from AngularJS $location to Angular Location, thus easing it for applications with hybrid operations that depend on upgrade and route in AngularJS as well as Angular part.
Some Benefits of Angular 8 Ivy :
- Smaller bundles
- Decreased payload size
- Pre-compiled code shipment
- Enhanced backward compatibility
- Faster rebuild times
- Improved template type checking
- Dismissal of metadata.json
- The emergence of metaprogramming
- Broad compatibility with existing Angular applications
Currently, Ivy is included in Angular 8.0 only as an opt-in preview for testing. Angular developers can try it out to determine the potential and performance of their Angular application. Once it is completed, it will make such applications simpler, smaller and faster than before.
Contact us for More Information