This week, we’re back to the 3-2-1 format of the newsletter. I’m posting a few essential articles to revisit, updates to know about, and one question to ponder:

Three articles to revisit:

• Data bindings are one of the older features of Angular, and they were a revolution back when Angular JS was released. Especially 2-way bindings with ngModel. Did you know you can use ngModel with Signals, and even create your own 2-way data bindings without ngModel, which is even improved and simplified with the signal-based model() function?

Two quick updates:

• The Angular team posted a summer update that recaps the current stats of Angular and updates from the latest versions.
• I’m running a 3 half-day workshop to prepare developers for our Senior Angular Certification Exam, starting next Monday – and there’s a 50% discount on that workshop now:

One question to ponder:

• Have you tried using https://deepwiki.com to explore GitHub repositories (example result: https://deepwiki.com/alcfeoh/ngx-training) and get auto-generated documentation, architecture graphs, and more! It’s quite impressive.

Another month, another minor version of our favorite front-end framework!

Zoneless

This time around, Zoneless change detection becomes stable (more about Zoneless here), so you can remove Zone.js from the equation if you’ve followed the rules to make sure Angular will detect your changes properly with OnPush-compatible components.

Animations

The @angular/animations package is deprecated and replaced with a new API using the animate.enter/animate.leave syntax as follows:

 <div animate.enter="fade-in" animate.leave="fade-out">My content</div>Code language: HTML, XML (xml)

Aliases in blocks

You can use local aliases in if, else, and else if blocks as follows:

⁠@if (currentUser(); as user) {
  Welcome user {{ user.name }}!
} @else if (expiredSession(); as exp) {
  Please log in. Your session expired at {{ exp.time }}
}Code language: JavaScript (javascript)

New diagnostics

Diagnostics give you hints and feedback on possible mistakes. These apply to instances where your code compiles but is likely doing something wrong. A new diagnostic called uninvokedFunctionInTextInterpolation has been added to warn you when you use a method in a template without calling it (forgot the parentheses).

Testing

You can now use a headless browser with your Vitest unit tests using the builder introduced in v20. This is still experimental, though.

As a reminder, here are the updates from the previous version, Angular 20.1.

This week, we’re back to the 3-2-1 format of the newsletter. I’m posting a few essential articles to revisit, updates to know about, and one question to ponder:

Three (maybe four) articles to revisit:

• Have you ever used ElementRef in Angular? It’s a way to access DOM elements natively, which can come in handy when integrating with some 3rd party libraries.
• With the introduction of takeUntilDestroyed and the inject function, it has become more important than ever to understand what is an injection context.

Two quick updates:

• I’ll be giving several talks and one full-day workshop in New York City in early October at the International JavaScript Conference. You can get 10% off the regular conference price by using my personal code ijsny-alain
  

• A talk I’m looking forward to: The Angular team is presenting a “Deep Dive into the Angular Signal Forms” at Angular Connect on September 13th. Could it be a sign of imminent release in developer preview? Wait and see…

One question to ponder:

• With Angular Signals now in the mix, many are rethinking their state management strategy. If you’re a long-time user of a state management library, has your perspective shifted? Knowing what you know now, would you still reach for a library on a new project?

It’s been quite some time since I last asked for feedback about the newsletter, and since we’re in the midst of summer and things tend to be a bit slower during that time of year, I thought now would be a good time to ask for your feedback.

Here is the feedback form for you, with just five quick questions and the option to provide more elaborate feedback if you wish. I’m always looking for external contributors, too, so feel free to let me know if you’d like to write about something interesting.

The regular newsletter will be back next week with a full article on the blog.

Angular 20.1 was just released by the Angular team, with a lot of good tools for improved developer experience:

Developer Tools

• Signal Dependency Graphs: The Angular devtools extension includes an experimental feature to visualize the dependencies between signals in a graph. You can also inspect a signal and jump directly to its definition in the code. Signals also “blink” in the graph when their value changes.

Testing

• Simplified Component Testing: New binding helpers (inputBinding(), outputBinding(), twoWayBinding()) allow you to set a component’s bindings directly during testing, without doing manual assignments or using wrapper components.

Performance

• Optimized Template Compilation: The Angular compiler now uses more efficient, DOM-only instructions for elements that don’t have any directives applied, leading to better runtime performance.

Templates

• Assignment Operators: You can now use assignment operators like +=, -=, and *= directly in your component templates.
• NgOptimizedImage Decoding: The NgOptimizedImage directive now includes a decoding option, which can be set to async to avoid blocking the main JS thread.

HTTP Client

• New HttpClient Options: A variety of new options have been added to HttpClient, including timeout, cache, priority, and credentials, giving you more control over HTTP requests and helping to improve Core Web Vitals.

AI and Angular CLI

• AI-Assisted Development: Angular is integrating with AI development tools through the new ng mcp command, which starts a Model Control Protocol (MCP) server. This allows AI tools to better understand your Angular workspace for more accurate suggestions.
• New Asset Loaders: The CLI now supports dataurl and base64 loaders, allowing you to inline small assets directly into your application’s code.

In the 3-2-1 format of the newsletter, I’m posting a few essential articles to revisit, updates to know about, and one question to ponder:

Three articles to revisit:

• This series shows how simple template changes can impact performance: part 1 – part 2 – part 3.

Two quick updates:

• Angular v20.1 is coming soon (the first RC is out) with new options and improvements for httpResource regarding authentication and caching.
• The Angular team just posted more details about the new devtools track in Chrome, and it’s definitely a big improvement in terms of data integration, all in one place. The article features a few screenshots explaining the different colors used in the track, which seems well thought out and useful.

One question to ponder:

Do you use TypeScript path mapping to simplify your TS imports? If not, here’s what it does and how to enable it.

In the 3-2-1 format of the newsletter, I’m posting a few essential articles to revisit, updates to know about, and one question to ponder:

Three articles to revisit:

• Even though Signals are changing the state management landscape in Angular, it’s still a good idea to know the basics of state management libraries to make an informed decision. Here are some past tutorials to learn about actions, reducers, effects, state and store, or if you’d rather watch videos about it, I have this video course on LinkedIn Learning.

Two quick updates:

• Just as we did with the Angular certification one year ago, we have relocated, updated, and expanded our React certification at certificates.dev. Check it out while the prices are at their lowest post-launch!
• If you’ve ever wondered about using React instead of Angular, you might want to watch this recording of my comparison of React and Angular, feature by feature. Spoiler alert: If you know Angular, you pretty much know React, too.

One question to ponder:

• If you ever hear someone claiming that Angular is done, that everybody uses React these days, or any similar nonsense, here is a resource you can mention to such people:  https://www.madewithangular.com. That list is, of course, non-exhaustive, but the number of airlines and banks listed here should be plenty enough to silence doubters. And yes, Gemini, Google’s AI that beats ChatGPT in several areas, is made with Angular, too!