Wednesday, 29 May, 2019 UTC


Summary

Angular's 8.0.0 release is here! This is a major release that brings some nice features. For the official blog post, check the official Angular post on Medium.
Let's talk about some of the changes.
Updating to Angular v8
There's a great tool to help you upgrade Angular (for any version):
![](https://scotch-res.cloudinary.com/image/upload/v1559151165/ctmthbblzxlyrsuqmlvd.png) For the majority of developers and projects, you can update using a quick command using the Angular CLI ```bash ng update @angular/cli @angular/core ``` You should see the changes taking place to get you up to date. ## Differential Loading This update is exciting. Any updates to get Angular bundle sizes smaller is good in my book. [Differential Loading](https://web.dev/codelab-serve-modern-code) is the way in which a browser chooses between modern or legacy JavaScript based on its own capabilities. There are now two bundles: * Modern bundle \(ES2015/ES6\) * Legacy bundle \(ES5\) Users will automatically get the right one for their browser! Check the [official post](https://blog.angular.io/version-8-of-angular-smaller-bundles-cli-apis-and-alignment-with-the-ecosystem-af0261112a27) for instructions on how to turn it on. > The angular.io website saved over 40kb of bundle size for modern browsers. ![](https://scotch-res.cloudinary.com/image/upload/v1559151175/rpr5eckozlz80gjjhvo5.png) ## Dynamic Imports for Lazy Loading! We can now use the industry standard [dynamic imports](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) for lazy loading. We used to have to use `loadChildren`. Here's the before and after: ```javascript // before (a string) { path: '/admin', loadChildren: './admin/admin.module#AdminModule' } // now with import() { path: `/admin`, loadChildren: () => import(`./admin/admin.module`).then(m => m.AdminModule) } ``` It is more writing but we have more developer tooling \(VS Code can understand and help us import the correct file\) in this and it's also industry standard. `ng update` will handle this upgrade for you. ## Ivy & Bazel Ivy \(new rendering engine\) is one of the most exciting things in the Angular pipeline. These are opt-in previews and more updates will come soon. ## More Cool Stuff Check the [official post for more info](https://blog.angular.io/version-8-of-angular-smaller-bundles-cli-apis-and-alignment-with-the-ecosystem-af0261112a27) on the following cool updates: **Builder APIs in the CLI**: Schematics allowed us to tap into some of the CLI commands. [Builder APIs](https://blog.angular.io/introducing-cli-builders-d012d4489f1b) will allow us to further customize the CLI through `ng build`, `ng test`, and `ng run`. We can perform things like custom build and deployment! **Workspace APIs in the CLI**: For Schematics, we had to update the `angular.json`. With [Workspace APIs](https://github.com/angular/angular-cli/tree/master/packages/angular_devkit/core#workspaces), we have a new API for this modification. **Web Worker Support**: [Web workers](https://v8.angular.io/guide/web-worker) excel at things that are CPU intensive. They can offload the work to a background thread so your users aren't bogged down by image or video manipulation. **New Deprecation Guide**: The new [deprecation guide](https://v8.angular.io/guide/deprecations) will help us find removals and deprecations in Angular. ## Conclusion Angular is getting better and better with every release. I'm looking very much forward to Ivy and smaller bundle sizes so we can get all the Angular goodness in faster sizes.