Standalone architecture

If you create a standalone project, your dependencies will be provided at the root level bootstrapApplication function. First-party and third-party libraries are updated to expose provider functions instead of modules. These provider functions are inherently tree-shakable, meaning the framework can remove them from the final package if unused. The provider functions can be customized using “with” functions, where a function named withFeature() can enable a certain feature.

In standalone projects and while using standalone components in general, we must explicitly import the features they use that are not included in the providers. This means pipes, directives (including fundamental directives like *ngIf -- unless you’re using @if, of course), and child components must be provided. This can feel more verbose and restrictive than an NgModule project, but the long-term benefits outweigh the short-term pain. The better information we can provide to the framework about our projects, the better the framework can optimize our code and improve performance.

You can migrate existing NgModule projects to a standalone project using the following command:

$ npx ng g @angular/core:standalone

Beware - this is not a foolproof or entirely automated process. Read about it more at https://angular.dev/reference/migrations/standalone.

The router is the next most powerful technology you must master in Angular.