What Is New in Angular 5.0
Angular 5.0, codenamed "Pentagonal-Donut," introduces significant optimizations for application speed and size, along with developer experience improvements to make the transition smoother.
| Category | Key Changes |
|---|---|
| Build Optimizer | Enabled by default for production builds, removing unnecessary code. |
| Compiler Improvements | Enhanced decorator support, stricter type checking, and reduced bundle size. |
| Forms & HTTP | New updateOn blur option for forms and HttpClient as the default. |
| Pipes | New number, date, and currency pipes using the CLDR, improving internationalization. |
| Deprecations | HttpModule and the old pipes are deprecated in favor of new APIs. |
How did Angular 5 improve build size and speed?
The core improvement is the Build Optimizer, which is now on by default for production builds. It performs advanced tree-shaking to eliminate unused code and remove Angular decorators from your application's runtime, resulting in significantly smaller bundles.
In practice, this means your users download less JavaScript, leading to faster load times. The compiler itself was also updated to generate more efficient code during the Ahead-of-Time (AOT) compilation process, which further contributes to performance gains.
What changed with forms and HTTP in Angular 5?
Angular 5 promotes the HttpClient from @angular/common/http to the default library for making API calls. It includes built-in JSON parsing and better type safety than the old Http module, which is now deprecated.
For forms, a major feature is the updateOn option. You can now specify that a form control should update its value and validate only on blur or submit events instead of every input event, which can drastically improve performance for large forms.
// Using updateOn with a FormControl
const name = new FormControl('', {
updateOn: 'blur',
validators: Validators.required
});Why were the number, date, and currency pipes replaced?
The old pipes were replaced to achieve proper internationalization (i18n) compliance. The new pipes use the Unicode Common Locale Data Repository (CLDR) standard, which provides more accurate and consistent formatting across different languages and regions.
This matters because applications with a global audience will now display numbers, dates, and currencies correctly according to locale-specific rules. The old pipes were moved to @angular/common but are deprecated and should be replaced with the new implementations.
Were there any changes to how Angular compiles code?
Yes, the compiler became more strict and efficient. It now performs more rigorous type checking within templates, helping you catch errors earlier in the development process. This is a step towards making Angular templates fully type-checkable.
The compiler also generates less code for AOT compilations and supports lambda expressions in metadata, which allows for cleaner code when providing configuration.
// Lambda expressions are now supported in metadata
@NgModule({
providers: [
{ provide: SERVER, useFactory: () => new Server() }
]
})FAQ
Is the Build Optimizer something I need to configure?
No, it's enabled by default for production builds when you use the Angular CLI. You can see its effect by comparing the output bundle sizes of ng build versus ng build --prod.
I was using the old Http module. Do I need to change my code immediately?
The old HttpModule is deprecated but still available. You should plan to migrate to HttpClientModule as it offers a simpler API, interceptors, and better testability.
What happens if I don't replace the deprecated date/number pipes?
Your application will continue to work, but you will see deprecation warnings. The old pipes do not use the CLDR standard, so for proper i18n support, migrating to the new pipes is strongly recommended.
How does the updateOn option help with form performance?
By changing the update trigger from 'input' to 'blur', you reduce the number of times change detection and validation logic runs. This is a quick win for improving responsiveness in forms with many inputs.
Does Angular 5 require me to use TypeScript 2.4?
Yes, Angular 5 now requires TypeScript 2.4 as a minimum version. This allows the framework to leverage newer TypeScript features for better type checking and compiler performance.