---
title: "Angular 5 Release: What’s New?"
description: "Angular 5 brings some new features to the popular JavaScript framework for building mobile, desktop and web applications. Learn what's new in Angular!"
authors:
- name: "Prosper Otemuyiwa"
url: "https://auth0.com/blog/authors/prosper-otemuyiwa/"
date: "Nov 14, 2017"
category: "Developers,Whats New,Angular"
tags: ["angular", "angular5", "javascript", "frontend", "authentication"]
url: "https://auth0.com/blog/whats-new-in-angular5/"
---
# Angular 5 Release: What’s New?
---
**TL;DR:** Angular is an all-encompassing JavaScript framework that is frequently used by developers all over the world for building web, desktop, and mobile applications. In this article, I'll cover the new features in Angular 5 and several other changes and deprecations.
---
Angular is built and [maintained by Google.](https://developers.google.com/experts/all/technology/angular). It is a platform that combines declarative templates, dependency injection, end to end tooling, and integrated best practices to solve development challenges. Web platforms such as _Google Adwords_, _Google Fiber_, _Adsense_, and _Winc_ use Angular to build their user interfaces.
Angular 5 was announced to the world on November 1, 2017. The previous Angular version was 4.4.0. This release focused on making Angular smaller and faster to use. Let's go through the major changes in version 5.
## 1. Http Deprecated, HttpClient Here to Stay
Before version 4.3, the `@angular/http` module was used for making HTTP requests in Angular applications. The Angular team has now deprecated `Http` in version 5. The `HttpClient` API from `@angular/common/http` package that shipped in version 4.3 is now recommended for use in all apps. The `HttpClient` API features include:
* Typed, synchronous response body access, including support for JSON body types.
* JSON is an assumed default and no longer needs to be explicitly parsed.
* Interceptors allow middleware logic to be inserted into the pipeline.
* Immutable request/response objects.
* Progress events for both request upload and response download.
* Post-request verification & flush based testing framework.
```js
import { HttpClientModule } from '@angular/common/http';
```
## 2. Support for Multiple Export Alias in Angular 5
In Angular 5, you can now give multiple names to your components and directives while exporting. Exporting a component with multiple names can help your users migrate without breaking changes.
_Example Usage:_
```js
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
exportAs:'dashboard, logBoard'
})
export class AppComponent {
title = 'app';
}
```
## 3. Internationalized Number, Date, and Currency Pipes
Angular 5 ships with new number, date, and currency pipes that increase standardization across browsers and eliminate the need for i18n polyfills. The pipes rely on the [CLDR](http://cldr.unicode.org) to provide extensive locale support and configurations for any locales you want to support. To use the old pipes, you will have to import the `DeprecatedI18NPipesModule` after the `CommonModule`.
```js
import { NgModule } from '@angular/core';
import { CommonModule, DeprecatedI18NPipesModule } from '@angular/common';
@NgModule({
imports: [
CommonModule,
// import deprecated module after
DeprecatedI18NPipesModule
]
})
export class AppModule { }
```
## 4. Improved Decorator Support in Angular 5
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:
_In Angular 5_
```js
Component({
provider: [{provide: 'token', useFactory: () => null}]
})
export class MyClass {}
```
_Before Angular 5_
```js
Component({
provider: [{provide: 'token', useValue: calculated()}]
})
export class MyClass {}
```
## 5. Build Optimization
The Angular team focused on making Angular 5 faster, smaller and easier to use. In Angular 5, production builds created with the Angular CLI will now apply the build optimizer by default. 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. In addition, the build optimizer removes part of your application that is not needed during runtime via tree-shaking. This action leads to a decreased bundle size, and faster application speed.
## 6. Angular Universal Transfer API
The Angular Universal team has added [Domino](https://github.com/fgnass/domino) to the `platform-server`. This simply means more DOM manipulations can happen out of the box within server-side contexts.
Furthermore, two modules, `ServerTransferStateModule` and `BrowserTransferModule` have been added to Angular Universal. These modules allow you to generate information as part of your rendering with platform-server and then transfer it to the client side to avoid re-generation of the same information. In summary, it transfers state from the server which means developers do not need to make a second HTTP request once the application makes it to the client.
## 7. Faster Compiler in Angular 5
A lot of improvements have been made to the Angular compiler to make it faster. The Angular compiler now leverages TypeScript transforms. You can take advantage of it by running:
```bash
ng serve --aot
```
[Angular.io](https://angular.io) was used as a case study and the compiler pipeline saved 95% of the build time when an incremental AOT build was performed on it.
> **Note:** TypeScript transforms are a new feature introduced as part of TypeScript 2.3, that allows hooking into the standard TypeScript compilation pipeline.
## 8. Forms Validation in Angular 5
In Angular 5, forms now have the ability to decide when the validity and value of a field or form are updated via on `blur` or on `submit`, instead of every input event.
_Example Usage_
```html
```
_Another Example_
```html