Aspx versus Razor

If you have been using the later versions of Visual Studio (2010 and above), you might have seen a new template for Asp.Net websites called “Razor”. Razor is a view engine that allows you to add server code into web pages.

So, what is the big deal, you may ask. Didn’t asp.net allow it too? Yes, it did. The difference, however, is that it is much simpler, compact and cleaner to add server code using razor as compared to traditional aspx. If you are a beginner in Asp.net with good html skills, then you will be able to learn and build web applications very easily in Razor compared to other view engines.

Here is a simple example implemented in aspx and razor. You can see the differences in syntax.

When you create a web application and choose the “Razor” template, your files have the .cshtml extension (not .aspx). Let us say you have a static line of code saying:

<p>Welcome to the site</p>

Now, if you want to add the visitor’s time of visit to this, your code in aspx will be:

<p>Welcome to the site. You are visiting here at <%=DateTime.Now%></p>

The same code in Razor would be:

<p>Welcome to the site. You are visiting here at @DateTime.Now</p>

This may not look like a big deal given that it is just one line of code. But in complex scenarios where several thousand lines of code is involved, this makes life a lot easier. Imagine trying to add the tags everywhere you need a piece of code. Worse still, imagine trying to fix an unbalanced aspx page with hundreds of opening (<%=) and closing (%>) tags.

Let us consider a slightly more complicated example to drive this home. Say a visitor visits the site every second (just to keep it simple) and you want to display the time of visit of last 10 visitors as a list. Your code in aspx would be:

<ul><% for (int i = 1; i < 10; i++) { %>
<li%>Visitor <%=i%> visited at <%=@DateTime.Now.AddSeconds(-i)%></li%>
</ul>
<%}%>

There are 8 tags in this simple piece of code. You also have to specify the begin and end (<%= %>) for each code element.If you miss a single tag, the code either won’t compile or won’t work.

The same code in razor goes so:

<ul>@for (int i = 1; i < 10; i++) {
<li>Visitor @i visited at @DateTime.Now.AddSeconds(-i)</li>
</ul>
}

Only 3 @ symbols and no need to explicitly specify where the for loop begins and ends. The reason why razor syntax is so much simpler is because razor has semantic knowledge of code used within c#/vb blocks, and hence it does the necessary opening/closing of code block by itself. So, unlike aspx code, you don’t have to enclose each snippet with opening/closing tags. Razor is also smart enough to understand that the<li>is part of server code and hence the looping should include it.

Can you see the advantages now? Not only is the code much easier to read, but it is also remarkably similar to html and php. So, if you have an existing application in html, it is much easier to convert it into asp.net using Razor. In addition, you can make the changes easily with any editor, you can even use notepad. On the other hand, trying to work on a complex aspx page with lot of server code using notepad is guaranteed to drive you crazy.

Leave a Reply

Your email address will not be published. Required fields are marked *


3 − one =

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>