The top 5 new features of Angular did you know
Categories: Angular
The top 5 new features of Angular did you know
1. Differential loading
Differential loading is a new feature that lets you use version 8 of the Angular CLI to create two different production bundles of your app. Attributes on the <script> tag in your index.html file let the browser request the most appropriate bundle; modern browsers will request a bundle that uses ES2015 JavaScript syntax and will be significantly smaller than the legacy bundle that uses ES5 syntax to maintain support for older browsers. Differential loading is enabled by default for new apps created with version 8 of the CLI, but you can easily enable this feature on your existing apps by upgrading to Angular 8, adding a browserlist configuration file, and setting the “target” option in your tsconfig.json file to “es2015”. The result? Your users with modern browsers get a smaller bundle that loads faster (and puts a bigger smile on their face).
2. New lazy loading syntax
Lazy loading feature modules has been a best practice in Angular for quite a while. That hasn’t changed in version 8, but in place of the proprietary syntax to enable lazy loading, the framework has adopted the more common dynamic import syntax used widely in client-side web development. The new syntax relies less on parsing class names from strings and enables editors and IDEs to check that you’re importing the correct items.
3. Create web workers with the CLI
Angular 8 makes it easier than ever to use web workers to handle CPU-intensive tasks in your apps. Version 8 of the Angular CLI includes a new schematic used with the ng generate command to create and update the necessary files in your project to add a new web worker. The new and updated files include a basic template for your new web worker so you can worry less about boilerplate syntax and more quickly focus on writing the code you want to run on a background thread.
4. Builder and workspace APIs
Although they’re probably not a feature you’ll use on every project, Angular 8 also includes new APIs that allow you to create custom build and deployment commands using hooks into the familiar ng build, ng test, and ng run commands. There are also new APIs that allow you to open and work with the workspace defined in your angular.json file, which should reduce the amount of manual manipulation required to perfectly configure your project.
5. A new guide for old features
The Angular team included a new deprecation guide with Angular 8 to make it easier for developers to keep track of deprecated features and APIs. The creation of this guide should not be misinterpreted as a warning that deprecations will be sprung on the developer community with little time for remediation. In fact, the Angular team is committed to supporting features for two major releases after officially being deprecated. The resulting stability in the framework coupled with the helpful deprecation guide should smooth the transition away from those older features.