'ASP.NET MVC (Razor) vs Angular 5

We are currently considering moving from ASP.NET MVC to Angular 5, mostly because it seems like the best and latest framework. However none of us seems to be able to come up with hard reasons on why Angular is better than MVC (Razor).

SPA vs MPA seems like different approaches with neither really being better - just better at different things.

Are there any resources/comparisons with hard benefits between the two?

Update: Almost 2 years after moving to Angular 4 (currently 7) I can say that it was a great decision. Angular makes it super easy to write quite complex front-end applications and the tooling around Angular itself, TypeScript, Karma + Jasmine (unit test frameworks) is fantastic. SPA is a huge step ahead of MPA in my opinion - we can finally have fluid web experience. I never really liked Razor and the whole mess around ajax/jquery, but I can comfortably say that I am really enjoying my time now! .NET CORE 3 + Angular 7 gives us everything we need!

To anyone thinking of taking the plunge, I would strongly recommend Angular (might as well start with 8 or 9, which is current at the time of writing this).

Happy to add more details if people want them :)



Solution 1:[1]

6 months on from moving from ASP.NET MVC to Angular 5 (now 6) and we are extremely happy with the decision. .NET core backend and Angular frontend is a fantastic combination. It is so much cleaner and easier to create re-usable, strongly-typed, testable and easy to modify UI components!

For anyone considering if it's worth taking the plunge - I would say a resounding 'yes'!

Solution 2:[2]

I don't have enough points to make a comment but thought the following might help you in making a decision.

Just to note that if you use Angular CLI (The default Angular project in Visual Studio) you will lose the ability to use razor within the HTML. Something you was able to do before Angular CLI.

I do like using Angular but miss having Razor to omit certain parts of the HTML, for example, if the user didn't have the necessary roles or permissions:

@if(User.IsInRole("Admin"))
{

}

You can hide the HTML using Angular of course, but having it completely removed from the HTML itself is preferable in my opinion.

Solution 3:[3]

I vote for an ASP.Net MVC Web Application in the cloud [Core or whichever] , and use of razor pages as needed. That is it. Case closed.

Even if the whole world runs after Angular , Aurelia, React, Node, Strawberry, Pistachio, butterscotch JS, I will not.

After all, JavaScript is spagetti and Angular is the Flying Spagetti Monster

based on personal experience and intuitive take.

Now please don't get started about mouse hover over page areas,

Solution 4:[4]

What I did found out about Angular vs MVC (Razor), I can work with both :-)

  • Authorization: One thing to make sure is that you don't have complex authorization schemes. On the backend its easy to do your authorization on pages with Razor (even more with Core). Its more difficult to handle authorization with Angular because you will have to do it (and keep in sync) on both sides: client and server. Example: One thing you want is hide everything a user is not allowed to do. If you have a simple webapp and use a Masterpage: show only the menu items a user is allowed to see. Thats a very easy task to do in Razor. It takes more time/effort to implement this in Angular.

  • Templates: Razor is extremely easy to use with templates. If you develop a website that must be used a number of times but with different layouts that can be done very easily with Razor.

  • Maintenance: With MVC you have one application. The frontend and backend are one. For maintenance you will have a Angular frontend and X Backend, so two. That seems more costly from installation, maintenance, etc. point. If you have a simple application I would say KISS: Keep It Simple Suckers.

  • One: In MVC the frontend and backend belong together. That can be good or bad. If you have one application with no dependencies on other things I think MVC is a good choice.

  • Future proof: Angular is NO W3C and NOT baked in the browser. Because of Future proof solutions there is a strong interest in Vanilla Javascript together with Web Components. With MVC you can use this technology. Read about Microsoft FAST Design. It works great with MVC.

  • SPA/MPA: Thats not a point anymore. An MPA can also be flicker-free with libraries like PJAX etc.

  • Speed: With MVC no wait time because Shit has to be loaded. Enough bad Angular websites already exists because loading takes ages.

  • ...: After working with Angular 9 I don't get the point of Angular. I don't know why you should go from MVC to Angular. Visual Studio has great support for MVC and is much better as VS Code. From productivity point I can produce much faster code with MVC as with Angular. If you have multiple front ends that must connect to the same backend may be then I can see the point. But even then MVC can be moduled and even can dynamically load them.

htmx Wow, now we are talking! Yes this is what we want. Let Html take back control how pages are loaded. Think this is the way to go. Worked a sample with NodeJS and are very exited about it.

Solution 5:[5]

One thing that I learnt during the comparison of MVC and Angular, among various factors, is that hosting MVC application requires a compute power container like Azure Web App, docker etc, while an Angular App can be deployed in any storage like Blob, CDN etc. When Angular is built, it gives a collection of javascript files, which are perfect candidate for storage container. They do not need compute power at all, which are the most costly resource in cloud world. CDN or Blob exposes Rest API endpoint to any of its underlying resource. So, the Angular will also be exposed as an API, which is all we want.

However, angular alone will not generate dynamic web pages. We need Web-Api at back-end to give the data. This can be achieved by a server-less solution (Function Apps, Logic Apps etc) or by containerization (Docker).

One downside that I personally found that the first time load of the Page in Angular is bit slow. After that it is really smooth.

All in all, I will vote for Angular/React and .Net Core in my future Web projects.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ross
Solution 2 Andrew
Solution 3
Solution 4
Solution 5