menu

Questions & Answers

When to use Standalone Components or Modules in Angular 14?

I would like to know when should I use Standalone components and when should I create a new module. Since it's a new concept introduced in angular, what are the criteria to use them?

I've created a new whole app only using standalone components with lazy loading routes, and everything works perfectly. Here the repo: https://github.com/Ismaestro/angular-example-app

So this means ng modules are obsolete?

What are the advantages and disadvantages of each of them?

Thanks in advance.

Answers(1) :

Standalone components are not mandatory and will never be, there is no rule when to use them. However, Angular Architects recommend to always use Standalone components at least for new components you create. They are simply more treeshakeable and less boiler. You can mix standalone components and modules also.

For the mentioned recommendation of the Angular Architects, you can also watch the Webinar from last Monday: https://www.youtube.com/watch?v=9rj8kR0q0c8

Comments:
2023-01-18 10:42:02
Nice!, so I guess if I start a new application is better to use only standalone components? Thanks for the link
2023-01-18 10:42:02
Yes, this approach is recommended. That is the way Angular is going forward.
2023-01-18 10:42:02
I'm playing with standalone components right now and I agree that we should all use standalone components over modules (at least going forward). That said, I think a potentially valid reason to use a module would be if you know for a fact that some number of components you are writing will always be used together. Then I would still write them as standalone components, but you can easily create a module to import and export all of the components so they are easy to import as one unit. This is just and idea I'm playing with and would love to here other thoughts.
2023-01-18 10:42:03
I think thats a fair use of ng modules!. I've created a post on dev.to and an example app. Here the links: dev.to/ismaestro/… and github.com/Ismaestro/angular-example-app