133

I am beginning to develop an Enterprise level web application. The application will have many separate web pages but two of those pages being more focused and very heavy - heavy as in a lot of user interaction, modals that display mass data, websocket connections, chat, etc.

I have been assigned to Chief Architect on the project, so I am doing some research into the latest web frameworks. For the back end, we have done some testing and have decided to go with the Azure SQL platform. So far, I am liking the improvements that have been made, and are being made, to ASP.NET with Core 2.0. Specifically the Razor engine, over previous versions of ASP.NET MVC.

I wanted to get some expert opinions on the "new" Razor vs. Angular/React and the like. I'm particularly more concerned with performance. How does Core 2.0 Razor hold up to client side rendering frameworks? Are the differences negligible? Our app is targeting a potential 1,000,000 users (roughly 100,000 concurrent).

Improve this question
5
  • 5
    With "new Razor" you mean Razor pages? Commented Nov 6, 2017 at 13:56
  • 50
    So which one did you choose in the end and how it’s going? Commented Feb 18, 2018 at 21:16
  • 5
    How did you get on (or are you getting on) with this project? I am in an almost identical situation to you now and would love an update! Commented Mar 26, 2018 at 10:08
  • 12
    Hi JLo and stt106. Sorry it took so long to respond. We ended up going with an Angular front-end and an ASP.NET Core API backend, using Azure SQL. It has worked out great for us so far! I would imagine React would be a similar replacement to Angular if you're more comfortable with it. I had to learn Angular, which was a very easy transition, and I love it now! Commented Jul 25, 2018 at 14:57
  • Speed comparison of ASP.Net Core vs Angular/React is off-topic? There can be canonical answers to it. As for today we have Core 2.2 and soon 3.0. Commented Jun 27, 2019 at 14:41

4 Answers 4

Reset to default
95

We ended up going with an Angular front-end and an ASP.NET Core API backend, using Azure SQL. We tested Core Razor and, although better than legacy Razor, Angular was much faster for us in the end. As far as user experience goes, Angular (or React) is far superior in terms of performance. The model-binding aspects of Angular we found to be a gigantic advantage of server-side rendering. Using Razor(or server side rendering in general) does, however, lend itself to better overall integrity as far as data goes and it makes for a better transition of data from front-end to back-end. There is a true disconnect between a front-end framework and an API. All data that is passed to the server has to be cast into typed objects - this means you have to manage two separate POCO model sets. This can cause issues if server objects and front-end objects do not align. At the moment, Entity Framework Core is not very matured so we have issues with updating objects, querying objects, including child objects, etc.

Overall, this setup has worked out great for us so far! I would imagine React would be a similar replacement to Angular if you're more comfortable with it. I had to learn Angular, which was a very easy transition, and I love it now!

Improve this answer
Sign up to request clarification or add additional context in comments.

10 Comments

As far as keeping the two POCO model sets sync'd there is a really useful extension for VS that creates angular interfaces from MVC models, check out typewritter
well, personally, if I had to go with Angular, I would use NoSql for the DB part.
I cannot imagine selecting ASP.NET razor above Angular. In the past ASP.NET gave some familiar code for .NET developers, but with RAZOR, the learning curve is higher then using Angular. MVC splits the logic from the HTML.
@Mark I don't believe that. Razor Pages are perfect, specifically the way they handle data binding. They're just too GOod. But ofcource for his scenario angular is perfectly suited.
@MosiaThabo, Mark isn't talking about Razor Pages, he's talking about Razor. Which is what my OP referred to. In my original post, I was not referring to Razor Pages (or now called Blazor, I think). I was specifically talking about client-side rendering vs server-side rendering. Razor Pages is Microsoft's flavor of Angular/React, which I think they see as necessary because of the advantages you have with Angular and React.
|
62

By using Angular/React with API on the server-side:

  • you eliminate the process of generating HTML on server-side and you save CPU
  • API produces a small payload (JSON) and Razor (HTML) of course would be much larger in size, the constant full page reloads, and postback round trip, so API and SPA save bandwidth
  • API and SPA could have different versioning, scaling and deployment scenarios
  • By using API you can support mobile app too and if you start with Razor you may need API in future

But by using Angular/React, you should be worried about clients:

  • client must enable javascript
  • client must have modern browsers
  • client must have enough powerful hardware
  • SEO
Improve this answer

4 Comments

I understand the differences in the two frameworks, I was more concerned with performance.
Same pipline exist for both but I don't know any benchmark exist for razor pages. this link may help - ASP.NET Razor Pages vs MVC: How Do Razor Pages Fit in Your Toolbox?
Razor supports mobile, the disadvantages don't really matter that are listed. Both are fast in their own way. I prefer Angular, but both are optimized. Razor optimizes code by not using a tree like MVC does. Angular is client side so it doesn't really use a tree, but also optimizes data in the HTML to an extent.
@NickTurner I understood it as not just viewing the webpage on your smartphone, but a full-on own app. E.g. an Android app, which could get the data from the unchanged server API as is, while on the other hand using the functionality Android provides - better animation support, notifications, toast messages etc.
33

I don't have benchmarks. But, I have several projects running JQuery, Razor, .NET MVC (C#), AJAX. Not to the scale you're tackling.

Advice.. Be sure to think things through and follow best practices. To keep things maintainable be sure to break controllers, views, model into smaller and meaningful groups. When I started, I made the mistake of putting everything into one Home controller, and a ton of views in the shared folder. Was fine at first but when feature creep began, it became a mess and difficult to go back and redesign.

I also use Linq2SQL. I made the mistake of creating models for everything and then realized I could just return the result set from my queries as a model. duh.

If you go .NET MVC and are concerned about performance, these are the things I ran into:

DON'T return partial views that create large blocks of HTML! Be sure to minimize everything. Get rid of all the white space. Use smaller ID names. Take the time to create html that is as light as possible. Return JSON and have the client do some of the work.

Be careful on how you develop your CSS. Don't use a bunch of inline styles, take the time to incorporate into CSS files that you can later minimize.

Same goes for your client side JS. It's tempting to put the JS inside partial views. Keep things organized.

Rendering on IE is horrible. Especially if there are lots of images. Be sure to compress images as much as possible, without losing quality of course.

Improve this answer

Comments

-2

React vs Angular

  1. Basic Security on client side environment in Angular while React security not provide.

  2. Angular execution slow while React execution is fast due to virtual dom.

  3. Angular code is not 100% customize while react code is 100% customize.

  4. Default Typescript in Angular while React use Javascript and Typescript Both. This is the main reason many developer like React because developers like JavaScript

Improve this answer

1 Comment

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.