Minko Gechev on Angular 16 & 17 — game changer or loss of identity ?

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!