Angular

What’s new in Angular 8 – New Features and Ngsw-Bypass

Angular 8 New features

Hello all Angular enthusiasts. Angular 8 has arrived and believed it or not there are many of us who wanted to what’s new in Angular 8. In this article, we will see what is new in the latest Angular 8 release.

This article will cover some of the hot and new features of Angular 8. So without wasting much time, let’s go ahead and see what we got in Angular 8. We will also discuss each feature in detail and whether there are any deprecations and breaking changes.

Differential loading

Now with this new feature of differential loading, two bundles will be created when you build your application for production. One build will be for the modern browsers that support ES2015+ and the other one will be for older browsers that only support the ES5 version of JavaScript.

The correct bundle will be loaded automatically by the browser, thanks to the support of ES6 modules in newer browsers. Other than this, Differential Loading is the largest single performance improvement for Angular 8.

Improved Lazy loading

Since the initial days of its launch, Angular provided the support of lazy loading. New syntax has been introduced to declare your lazy-loading routes, using the import() syntax from TypeScript.

This is now the preferred way to declare a lazy-loading route, and the string form has been deprecated. The difference is that, that until now, for implementing lazy loading we have to write something like this.

{ path: '/cart', loadChildren: './cart/cart.module#CartModule' }

which will be changed like this in Angular 8

{ path: /cart, loadChildren: () => import(./cart/cart.module).then(m => m.CartModule) }

Ngsw-Bypass – Bypass a Service Worker

With the release of Angular 8, it is now possible to bypass the Service Worker for a specific request by adding the ngsw-bypass header. You can now bypass the service worker with the command or header ‘ ngsw-bypass‘ for a specific request.

this.http.get('api/users', { headers: { 'ngsw-bypass': true } });

Improvements in CLI workflow

Everyone’s favorite Angular CLI got better with the release of Angular 8. Now the ng build, ng test and ng run are equipped to be extended by 3rd-party libraries and tools.

Multiple apps on sub-domains

Before Angular 8, it was not possible to have multiple applications using @angular/service-worker on different sub-paths of the same domain, because each Service Worker would overwrite the caches of the others. But with Angular 8, you can now have multiple applications using the @angular/service-worker.

Conclusion

Once again, the Angular team was up to their marks. The migration to Angular newer is easy and doesn’t include large changes in code. Features like Differential loading, Web workers create a consciousness for the possibility of further optimization of application and support to the older and newer browsers.

Leave a Comment