Angular just got an update, and it comes with a bunch of new features worth checking out. Let’s break them down together.
Zoneless Angular is no longer in developer preview. It is stable now!
We’ve been waiting for this for a long time, and it’s finally here. In the latest version of Angular, Zoneless is now stable, so don’t hesitate to use it in your project. However, the focus of this article is to discuss the recent changes – the topic of Zoneless in Angular is quite extensive. If you want to learn how it works, click here.
Improved support for Typescript (5.9).
With the newest version of Angular, we can now take advantage of TypeScript 5.9 features, which are fully supported. This opens the door to several modern language improvements that can enhance both performance and developer experience.
For example, it’s now possible to import a module without triggering immediate execution:
import defer * as myFeature from "./common-module.js"
//no side effect//
//Here code is executed//
const value = myFeature.count();
It’s also worth mentioning that TypeScript 5.9 introduces a small but impactful improvement: the ability to see full interface types in editor tooltips and during hover inspection. This enhancement significantly improves the developer experience by making complex types easier to understand without jumping through multiple definitions. Take a look at the example below:
More information about the new version of Typescript can be found here.
Enhanced redirected property support.
First of all, let’s explain how this change can help us. Primarily it allows us to append our own logic regarding whether the request is redirected or not. See the following example:
export class RedirectServiceExample {
private readonly _httpClient = inject(HttpClient);
private readonly _userHandler = inject(UserHandler);
getUser(Id: string) {
return this._httpClient.get(`/api/users/${Id}`, { observe: 'response' }).pipe(
map((response: HttpResponse<any>) => {
if (response.redirected)
return this._userHandler.processRedirectedUser(id)
else return this._userHandler.processUser(response.body)
})
);
}
We can see that our logic is appended conditionally, giving us full control over how requests are handled in this situation. This means that depending on whether a response was redirected, we can implement different handling strategies – for example, logging the redirect for analytics, applying additional security checks, or modifying the flow of the application
Secondly, it improves consistency with the native Fetch API. By exposing the redirected property, HttpClient now behaves more like the Fetch API, providing developers with a familiar and predictable interface.
Moreover, this new functionality allows us to better ensure the security of our applications. For a simple example: we are able to block unauthorized redirects or introduce additional verification when a redirect is detected in the application. This is certainly a useful feature in the context of cross-origin policies.
Analytics in the context of the redirected property is important because it allows you to track how often and under what circumstances the application is redirected. This helps assess the performance, stability, and compliance of the request flow with the intended architecture.
Need a quick way to catch up on Angular evolution? Our free ebook covers everything from Angular 14 to the latest version: features, use cases, and business impact. This is an all-in-one, practical guide you can reference anytime. Download it here.
