DEV Community

Cover image for Episode 23/26: New Control Flow, Angular 17, AnalogJS, "Developer Preview"
ng-news for This is Angular

Posted on

Episode 23/26: New Control Flow, Angular 17, AnalogJS, "Developer Preview"

We had Alex Rickabaugh, talking about the need for a new control flow syntax. Minko Gechev confirmed the release plan for Signal-based components in Angular 17 as a developer preview. Brandon Roberts gave an update on AnalogJS and we finally got a definition for "Developer Preview".

Alex Rickabaugh: The need for a control flow syntax

Alex Rickabaugh, tech lead of the Angular framework, gave a thorough explanation about the need for a new control flow syntax.
Currently, we use the structural directives *ngIf, *ngFor, and *ngSwitch for the control flow.

Angular doesn't execute those imperatively, like an if statement in JavaScript. Instead, they act as some kind of metadata for the compiler. The compiler splits up the component into multiple views. A view stands for a set of DOM elements which are static. The control flow directives act as a criterion a view's creation.

In addition, the compiler generation an <ng-template> and applies the structural directives as a normal property binding on it.

The current approach has some issues though.

  • The syntax is not very developer friendly,
  • The type check is incomplete. This is especially the case for the else statement.
  • We need to use an <ng-container>, if we want to have a directive but don't want to create a separate DOM element. The same is true when we want to use multiple directives. We can apply just one to a DOM element (or ).
  • Finally, if multiple directives need to work together, it also can become quite hard.

The new RFC for control flow will fix those issues. It will be an extension of the template syntax.

According to Alex, one of the downsides of the upcoming approach is that they move away from the possibility of writing these kind of functionalities on your own (he called it user space). The new control flow will be a native feature of the template.

The main takeaway though is that there is a chance that *ngIf, *ngFor, and *ngSwitch might become deprecated. When and how, is a future topic. But Angular wants to have one way of doing central things.

Mountain View and San Francisco Angular June Virtual Meetup - YouTube

Join us for our June virtual meetup! Register online at goo.gle/mtv-sf-meet.

favicon youtube.com

Minko Gechev on Angular Air

Minko Gechev, Angular product lead, was a guest at the Angular Air podcast. He confirmed the plan to release Signal-based components in Angular 17 as a developer preview. The signals library, introduced in Angular 16, will already become stable.

The Signal-based component is a new type that runs without zone.js. The recommendation is to start using signals in performance-critical parts of your application.

It is not possible to come up with an automatic migration to Signals.

Brandon Roberts on AnalogJS

Brandon Roberts summarised the current status of Analog.js. This meta-framework adds features like Vitest, File-based routing, API routes, and server-side rendering and generation out of the box.

Meaning of "Developer Preview" & Future of Forms

In the latest recordings of the ng-conf, we got two new insights.


A feature marked as a "developer preview" is not a beta version. It is fully functional, and pre-stable but it could happen that the API might change.

Faster apps with Angular SSR | Mark Thompson & Jessica Janiuk | ng-conf 2023 - YouTube

Get the latest on Angular Server Side Rendering straight from the Angular team! In this ng-conf 2023 talk, Mark Thompson and Jessica Janiuk show us how Angu...

favicon youtube.com

Second, a forms overhaul is a mid-term goal. Currently, the Angular team doesn't know yet in which direction it will go. It might even be that Reactive and Template might come together again.

Angular Team Panel Q&A | ng-conf 2023 - YouTube

Angular information straight from the source!! Join our Angular Team panel: Minko Gechev, Emma Twersky, Mark Thompson, Jeremy Elbourn, Jessica Janiuk, Alex ...

favicon youtube.com

Top comments (1)

Collapse
 
harnilpatel profile image
Harnil Patel • Edited

With Angular 17, you can anticipate additional improvements to performance, developer productivity, and the ecosystem. The addition of new features and improvements by Angular is likely intended to simplify element architecture, provide better tooling, and accelerate the improvement process. Read more here: linkedin.com/pulse/elevate-your-we...