ASP.NET Core Razor Pages vs MVC: How Do Razor Pages Fit in Your Toolbox?

As part of the release of .NET Core 2.0, there are also some updates to ASP.NET. One of those is the addition of a new web framework for creating a “page” without the full complexity of ASP.NET MVC. New Razor Pages are a slimmer version of the MVC framework and in some ways an evolution of the old “.aspx” WebForms.

In this article, we are going to cover some of the finer points of using ASP.NET Razor Pages vs MVC.

  • The basics of Razor Pages
  • ASP.NET MVVM vs MVC
  • Pros and cons on Razor Pages
  • Using Multiple GET or POST Actions via Handlers
  • Why you should use Razor Pages for everything
  • Code comparison of ASP.NET Razor Page vs MVC

The Basics: What are ASP.NET Razor Pages?

A Razor Page is very similar to the view component that ASP.NET MVC developers are used to. It has all the same syntax and functionality.

The key difference is that the model and controller code is also included within the Razor Page itself. It is more an MVVM (Model-View-ViewModel) framework. It enables two-way data binding and a simpler development experience with isolated concerns.

Here is a basic example of a Razor Page using inline code within a @functions block. It is actually recommended to put the PageModel code in a separate file. This is more akin to how we did code-behind files with ASP.NET WebForms.

We Have Two Choices Now: ASP.NET MVVM or MVC

You could say that we now have the choice of an MVC or MVVM framework. I’m not going to go into all the details of MVC vs MVVM.

MVC works well with apps that have a lot of dynamic server views, single page apps, REST APIs, and AJAX calls. Razor Pages are perfect for simple pages that are read-only or do basic data input.

MVC has been all the rage recently for web applications across most programming languages. It definitely has its pros and cons. ASP.NET WebForms was designed as an MVVM solution. You could argue that Razor Pages are an evolution of the old WebForms.

Pros and Cons of Razor Pages

I’ve been doing ASP.NET development for about 15 years. I am very well versed in all the ASP.NET frameworks. Based on my playing around with the new Razor Pages, these are my pros and cons and how I would see using them.

Pro: More organized and less magical

I don’t know about you, but the first time I ever used ASP.NET MVC I spent a lot of time trying to figure out how it worked. The naming of things and the dynamically created routes caused a lot of magic that I wasn’t used to. The fact that /Home/ goes to HomeController.Index() that loads a view file from “Views\Home\Index.cshtml” is a lot of magic to get comfortable with when starting out.

Razor Pages don’t have any of that “magic” and the files are more organized. You have a Razor View and a code-behind file just like WebForms did. Versus with MVC having separate files in different directories for the controller, view, and model.

Compare simple MVC and Razor Page projects. (Will show more code differences later in this article.)

COMPARE MVC VS RAZOR PAGE FILES

Pro: Single Responsibility

If you have ever used an MVC framework before, you have likely seen some huge controller classes that are filled with many different actions. They are like a virus that grows over time as things get added.

With Razor Pages, each page is self-contained with its view and code organized together. This follows the Single Responsibility Principle.

Using Multiple GET or POST Actions via Handlers

By default a Razor Page is designed to have a single OnGetAsync and OnPostAsync method. If you want to have different actions within your single page you need to use what is called a handler. You would need this if your page has AJAX callbacks, multiple possible form submissions, or other scenarios.

So for example, if you were using a Kendo grid and wanted the grid to load via an AJAX call, you would need to use a handler to handle that AJAX callback. Any type of single page application would use a lot of handlers or you should point all of those AJAX calls to an MVC controller.

I made an additional method called OnGetHelloWorldAsync() on my page. How do I call it?

From my research there seem to be 3 different ways to use handlers:

  1. Querystring  – Example: “/managepage/2177/?handler=helloworld”
  2. Define as a route in your view: @page “{handler?}” and then use /helloworld in the url
  3. Define on your input submit button in your view. Example: <input type=”submit” asp-page-handler=”JoinList” value=”Join” />

Why you should use Razor Pages for everything! (maybe?)

I could make an argument that Razor Pages are the perfect solution to anything that is essentially a web page within your app. It would draw a clear line in the sand that any HTML “pages” in your app are true pages. Currently, an MVC action could return an HTML view, JSON, a file, or anything. Using Pages would force a separation between how you load the page and what services the AJAX callbacks.

Think about it, this solves a lot of problems with this forced separation.

Razor PageHTML Views MVC/Web APIREST API calls, SOA

This would prevent MVC controllers that contain tons of actions that are a mix of not only different “pages” in your app but also a mixture of AJAX callbacks and other functions.

Of course, I haven’t actually implemented this strategy yet. It could be terrible or brilliant. Only time will tell how the community ends up using Razor Pages.

Code Comparison of ASP.NET Razor Page vs MVC

As part of playing around with Razor Pages, I built a really simple form in both MVC and as a Razor Page. Let’s take a look at how the code compares. It is just a text box with a submit button.

Here is my MVC view:

Here is my MVC controller. (My model is PageClass which just has two properties and is really simple.)

Now let’s compare that to my Razor Page.

My Razor Page:

Here is my Razor PageModel, aka code behind:


Deciphering the comparison

The code between the two is nearly identical. Here are the key differences:

  • The MVC view part of the code is exactly the same except the Razor Page has “@page” in it.
  • ManagePageModel has OnGetAsync and OnPostAsync which replaced the two MVC controller “ManagePage” actions.
  • ManagePageModel includes my two properties that were in the separate PageClass before.

In MVC for an HTTP POST, you pass in your object to the MVC action (i.e. “ManagePage(int id, PageClass page)”). With a Razor Page, you are instead using two-way data binding. To get Razor Pages to work correctly with two-way data binding I had to annotate my two properties (PageDataID, Title) with [BindProperty]. My OnPostAsync method only has a single input of the id since the other properties are automatically bound.

Will it Prefix?

Do Razor Pages work with Prefix? Yes! ASP.NET Razor Pages is supported by our free ASP.NET Profiler, Prefix. Our Retrace and Prefix products have full support for ASP.NET Core.

Summary

I really like Razor Pages and can definitely see using them in an ASP.NET Core project I am working on. I like the idea of Razor Pages being the true pages in my app and implementing all AJAX/REST API functions with MVC. I’m sure there are also other use cases that Razor Pages don’t work for. The good news is MVC is super flexible, but that is what also makes it more complex. The true beauty of Razor Pages is their simplicity.

No #1 Recommended ASP.NET Core Hosting

ASPHostPortal.com

ASPHostPortal.com  is the leading provider of Windows hosting and affordable ASP.NET MVC Hosting. ASPHostPortal proudly working to help grow the backbone of the Internet, the millions of individuals, families, micro-businesses, small business, and fledgling online businesses. ASPHostPortal has ability to support the latest Microsoft and ASP.NET technology, such as: WebMatrix, WebDeploy, Visual Studio 2015, .NET 5/ASP.NET 4.5.2, ASP.NET MVC 6.0/5.2, Silverlight 6 and Visual Studio Lightswitch, ASPHostPortal guarantees the highest quality product, top security, and unshakeable reliability, carefully chose high-quality servers, networking, and infrastructure equipment to ensure the utmost reliability.

HostForLIFE.eu

HostForLIFE.eu guarantees 99.9% uptime for their professional ASP.NET MVC hosting and actually implements the guarantee in practice. HostForLIFE.eu is the service are excellent and the features of the web hosting plan are even greater than many hosting. HostForLIFE.eu offer IT professionals more advanced features and the latest technology. Relibility, Stability and Performance of  servers remain and TOP priority. Even basic service plans are equipped with standard service level agreements for 99.99% uptime. Advanced options raise the bar to 99.99%. HostForLIFE.eu revolutionized hosting with Plesk Control Panel, a Web-based interface that provides customers with 24×7 access to their server and site configuration tools.

DiscountService.com.au

DiscountService.com.au is The Best and Cheap ASP.NET MVC Hosting. DiscountService.com.au was established to cater to an under served market in the hosting industry web hosting for customers who want excellent service. DiscountService.com.au guarantees the highest quality product, top security, and unshakeable reliability, carefully chose high-quality servers, networking, and infrastructure equipment to ensure the utmost reliability. DiscountService.com.au has ability to support the latest Microsoft and ASP.NET technology, such as: WebMatrix, WebDeploy, Visual Studio 2015, .NET 5/ASP.NET 4.5.2, ASP.NET MVC 6.0/5.2, Silverlight 6 and Visual Studio Lightswitch. DiscountService.com.au is devoted to offering the best Windows hosting solution for you.