In a recent podcast, Minko Gechev — Lead and manager for Angular developer relations - shared valuable insights into the future of Angular and its planned developments. Let’s go over key takeaways from that interview, focusing on the framework’s future direction.
Hydration API
Angular Lead mentioned the new hydration feature that Angular is introducing, which helps in server-side rendering and improves performance. Angular is now focusing on partial hydration, which will result in faster rendering times for applications.
The goal is to have better SSR support and more seamless transitions between server-rendered and client-rendered content.
Introducing DestroyRef
One of the most notable enhancements discussed by Minko is the introduction of DestroyRef. This feature enables developers to invoke the ngOnDestroy hook more flexibly and integrate it with various parts of the component’s lifecycle.
class ExampleComponent {
constructor() {
inject(DestroyRef).onDestroy(() => {
// do something when the component is destroyed
})
}
}
This was previously impossible, as developers had to place the ngOnDestroy code directly in the method itself. DestroyRef will improve integration with libraries like RxJS, making Angular development more efficient.
Angular Material Libraries and Design Tokens
Minko highlighted the impact of design tokens on Angular app development, particularly within Material 3. Design tokens provide developers with greater flexibility for customizing existing Material components.
The Material team at Google will ensure that these tokens remain stable, allowing developers to create finely-tuned components without worrying about frequent changes.
Flattening the Angular Learning Path
Simplifying the Angular learning path is a priority for the Angular Team. Minko outlined several incremental improvements aimed at making it easier for developers to learn and work with Angular.
He says that RxJS is overwhelming for new developers and Angular Team aims to satisfy both sides. If you want to use RxJS go for it, that’s okay. If you don’t want to use it, go with Signals. Mix of both? Feel free.
Example of interop:
const counter: Signal<number> = toSignal(counter$);
const counter: Observable<number> = toObservable(mySignal);
Over time plan is to reduce the RxJS involvement in core parts of the framework. Are both new and existing developers going to be happy with the changes? Looking at recent discussions in RFCs — some veteran developers have major concerns about the approach for the future.
Standalone Components
The introduction of standalone components is a foundational step towards simplifying Angular. This feature will make learning about NgModule and scoping optional for developers working on standalone apps.
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
standalone: true,
styleUrls: ['./app.component.scss']
})
export class AppComponent {}
There are also improvements expected for how standalone components are handled today.
Simplifying Component Authoring Experience
Minko briefly mentioned that the Angular Team is considering making component, directives, and pipe decorators optional. Aim would be to further simplify the component authoring experience and reduce complexity.
This will result in a simpler, more functional-based approach for creating inputs and outputs.
Angular CLI Simplification
The CLI will be updated to have less conceptual overhead, and improvements will be made to the project structure, making it easier for developers to navigate and work with Angular projects.
Improved Documentation and Learning Experience
Angular Team will focus on creating more engaging and digestible tutorials, helping developers learn Angular more efficiently and enjoyably.
This would be a giant help and improvement over current shape of Angular documentation available today.
In summary, the future of Angular looks promising, with a focus on simplification and improved learning experiences for developers. The introduction of DestroyRef, design tokens, and the flattening of the Angular learning path are just a few of the key developments that will shape the framework’s direction moving forward.
On the other hand it sounds like it brings Angular more towards functional components and closer to main competitors on the framework market — React & Vue.
This is a very brief summary — I recommend watching the whole podcast!
Before I have summarized what is happening around Sub-RFC3 & Sub-RFC4 — looking at how things are shaping up — are you excited about the future of Angular?
Or a little bit worried that the framework might lose it’s identity with all of the changes that are coming?
You have a last chance to participate in Signals RFC! — Angular Team is closing it on Monday, April 24! — see here.
I hope you liked my article!
If you did you might also like what I am doing on Twitter. I am hosting live Twitter Spaces about Angular with GDEs & industry experts! You can participate live, ask your questions or watch replays in a form of short clips :)
If you are interested drop me a follow on Twitter @DanielGlejzner — would mean a lot :). Thank You!
Top comments (14)
OnDestroy ref could be very useful to get rid of unsubscribe event emitters/subjects.
While there is a package called until destroy it will become pointless when angular will have it's own observable point of reference to know when a Component is destroyed. Simply - Less boilerplate
Signals are far easier to learn/understand/use and will be quicker to implement than let's say BehaviorSubject. At least that seems to be the idea.
For me standalone components are a lifesaver when it comes to largely reusable components. Something that would otherwise have to be stuck inside a shared module can now be it's own thing without the need to create a module.
And then there is the SCAM pattern that is pretty much replaced by standalone components.
We are going to talk about it live next week on Twitter:
https://twitter.com/danielglejzner/status/1648622946464792577?s=46&t=O3K13poFxIpAs5QEGn_LLA
Make sure to join or listen to replay :)
You missed everything... watch a few youtube streams of ryan carniato explaining signals.
How can I join the war against React! I love angular angular is the future!
While Angular Team keep separate HTML, CSS and TS an each one in respective files, welcome the new changes that is expect to bring benefits.
You can have them in same file
I know, but I would not have see the angular Team take the decision like JSX
I would definitely not like TSX, but it's individual I guess. I like the clean interface between declarative and a component with an interface.
I've been working too much with React and the absolute mix of js and css and html is just killing me /s
Angular lost its identity since v5 :)
As an Angular Developer, I'm waiting for this release & excited to see how it's going to be. 🔥
Super excited
Angular FTW