Don't use ngIf or ngFor
Angular 17 introduces new control flow syntax. Here’s a summary of the benefits of using this syntax:
-
More ergonomic syntax that is closer to JavaScript, thus more intuitive requiring fewer documentation lookups
-
Better type checking thanks to more optimal type narrowing
-
It’s a concept that primarily exists at build-time, which reduces the runtime footprint (making it “disappearing”) which could drop your bundle size by up to 30 kilobytes and further improve your Core Web Vital scores
-
It is automatically available in your templates without additional imports
-
Significant performance improvements
Old
<div *ngIf="loggedIn; else anonymousUser">
The user is logged in
</div>
<ng-template #anonymousUser>
The user is not logged in
</ng-template>
New
@if (loggedIn) {
The user is logged in
} @else {
The user is not logged in
}