Entries:
Comments:
Posts:

Loading User Information from Channel 9

Something went wrong getting user information from Channel 9

Latest Achievement:

Loading User Information from MSDN

Something went wrong getting user information from MSDN

Visual Studio Achievements

Latest Achievement:

Loading Visual Studio Achievements

Something went wrong getting the Visual Studio Achievements

Andrew Nurse: Inside "Razor"

Download

Right click “Save as…”

ASP.NET's latest MVC view engine, "Razor," is optimized for HTML generation using a code-focused templating approach. Razor minimizes the number of characters and keystrokes required in a file, and enables a fast, fluid coding workflow. Unlike most template syntaxes, you do not need to interrupt your coding to explicitly denote server blocks within your HTML. The parser is smart enough to infer this from your code. This enables a really compact and expressive syntax which is clean, fast, and fun to type.

How exactly does the "Razor" parser work? What were the design goals? How is it implemented? These are Going Deep questions and we knew exactly who could answer them. Meet Andrew Nurse, Software Engineer and one of the guys who designed and wrote the "Razor" parser. Of course, your questions are also asked. Thanks to those of you who posted them!

Tune in as we take a razor to "Razor."

Enjoy.

Tags:

Follow the Discussion

  • CKurtCKurt while( ( !​succeed=try​() ) ) { }

    Charles, great interview.

     

    I do have to argue with you xHTML is addopted pretty good, people like it. They just don't verify there code a lot. But most new site's  are using xHTML, afaik.

     

    Good to be back in the offices! Great technical stuff! Really great to see how they did it.

     

    PS: Any plans for enabeling RAZOR syntax in VS without instaling webmatrix? I don't want the 'simple ui' for non-pro devs, not that I'm a pro dev or anything...

  • Erik PorterHuman​Compiler Now with more apps

    Regardless of adoption, XHTML is not being advanced anymore (there is no team working on it anymore).  HTML 5 is the way to go moving forward.  While still in the works, since it is backwards compatible there's no reason to not start using the doctype now (and add in functionality as it gets more broadly adopted).

     

    Razor will have intellisense in VS.  Also, MVC will have a Razor view engine in the next version.

  • CKurtCKurt while( ( !​succeed=try​() ) ) { }

    Does HTML 5 build on xHTML ? I mean does it require closing all taggs by default? Or does still have traditional and strict doctypes (would be awefull imho) ?

     

    I know it will have intellisense in VS. I was talking about being able to right click and say Add -> New Item -> .cshtml file , even if you don't have Webmatrix installed. Because Razor is a part of webmatrix, but webmatrix has a sepperate UI from VS.

  • Actually HTML5 supports both HTML and XHTML syntax. There is one important change since XHTML 1.1 though.

     

    When using XHTML 1.1 you should use application/xhtml+xml as MIME Type, but when using HTML5 with XHTML syntax you must use application/xhtml+xml.

     

    That is a problem since pre-IE9 don´t support application/xhtml+xml. If you try to open it in IE 8 the browser asks you to download the file instead of displaying it in the browser. Because of this I use the "wrong" mime type at the moment at my personal site.

     

    For my personal site which I´m building at the moment, I use HTML5 with XHTML syntax (view the source to se what´s new):

    http://beta.mikaelsoderstrom.se

     

    Since IE 8 doesn´t support CSS 3, you should use IE 9 to view it. Smiley

     

    /edit

    I get Service Unavailable at the moment though.. Will take a look at it.

     

    /edit 2

    Uploaded to new hosting:

    http://vimpyboy.hostingbolaget.com/">http://vimpyboy.hostingbolaget.com

  • HTML 5 incorporates HTML and XHTML. In order to follow the standards correctly, the browser will parse as HTML if text content is received or as XHTML if XML content received. This is governed by the content type broadcasted by the web server.

     

    In reality, IE would freak out if you used the XML content type, and as all browsers will still parse XHTML 5 syntax even if the content type is text. I use XHTML syntax with HTML5, delivered as text.

     

    Rich

  • Erik PorterHuman​Compiler Now with more apps

    MVC will have an add new cshtml type of dialog.  I do not know if regular web site projects will though.

     

    Looks like I don't need to answer the HTML 5 question since it's already covered in great detail.  Wink

  • CKurtCKurt while( ( !​succeed=try​() ) ) { }

    Thx everybody for the great knowledge, I'm learning as I go.

     

    I visited your site (at new hoster) and saw you used <header> and <section> , are these new HTML5 tags or is this what you mean by saying +xml when you say: use xhtml + xml ? In other words, in xHTML you can only use the HTML taggs and must use them in an XML style way (close everything in right order, do styling in style attribute not in background attribute..)

     

    I had no idea you could use XML in HTML and tell a browser how to render your tagg.

     

    -----

    Something else: In the video they talk about expanding C# to make XML content possible and how difficult it would be. And it got me thinking. Could I do something like this ?

    <ul>
    @for( int i = 0 ; i < 5 ; i++) {
         string test = "<li>Title Item" + i  + "</li>";
         <li>random other item</li>

         @test
    }

    </ul>

     

    What happens if I remove the random item? How do I output the test variable (need to do it old way perhaps) ?

     

  • Erik PorterHuman​Compiler Now with more apps

    Not sure what that has to do with XML content, but yes, you can do that.  Just tried it in a test page and go this back:

    • Title Item0
    • Title Item1
    • Title Item2
    • Title Item3
    • Title Item4

    What exactly are you wondering about here?

  • CKurtCKurt while( ( !​succeed=try​() ) ) { }

    I'm so sorry... I changed my code sample right after I posted it, because of the local time, I forgot to make sure the xml (html taggs) were in the string. To make the point I was talking about. I also clearyfied my question I was wondering about.

     

    My point was, outputting a string that was actualy containing xml (html taggs). My guess is it will HTML encode the < > as &lt; &gt; in it won't be HTML. (Can't test right now don't have webmatrix)

  • The test variable is HTML encoded since you have a @ before using it.

     

    Header, section, article etc are new HTML5 elements. You can read more about the new elements here:

    http://www.alistapart.com/articles/previewofhtml5

  • Erik PorterHuman​Compiler Now with more apps

    Ah, gotchya.  Yes, everything is encoded by default.  The workaround right now is to use HtmlString (so when it goes to output it, it assumes it's already been encoded and doesn't touch it.

     

    <ul> @for (int i = 0 ; i < 5 ; i++) { var test = new HtmlString("<li>Title Item" + i + "</li>"); <li>random other item</li> @test } </ul>

  • You have <text> to write text without prnting elements, why not have html for HtmlString?

     

    Example with Text:

    @for (int i = 0 ; i < 5 ; i++) { <text>i = @i</text> }

     

    Example with Html:

    @for (int i = 0 ; i < 5 ; i++) { <html>i = <b>@i</b></html> }

  • If you have a string with XML tags in it and pass it through "@", it will be HTML encoded.  This is what I meant in the video when I mentioned that "@p" is like "<%: p %>" rather than "<%= p %>".

     

    However, if you pass an IHtmlString through "@", it won't be HTML encoded.  Right now, the easiest way to do this is:

     

    @(new HtmlString("<p>Some text</p>"))

     

    We are considering a helper method, something like "Literal" which would do this wrapping for you, meaning you could write:

     

     

    @{ var foo = "<p>Some text and markup</p>" } @Literal(foo)

     

    Just like in MVC, all of our helpers will output IHtmlString so you won't have to worry about them.  When writing your own markup helpers, you should ensure they return some type that implements IHtmlString (I recommend System.Web.HtmlString Smiley ) so they don't get encoded.

  • Looks like I was slow on the up-shot for the earlier reply and Erik beat me to it Tongue Out.  Btw, this is Andrew in case anyone is wondering, glad to hear your feedback on the Razor syntax and parser!

     

    The issue here the HTML encoding that is auto-applied when printing variables like "@i".  The contents of the <text> tag are considered HTML markup, and they can include HTML tags, we just don't render the outer <text> tag.  So there's no need for a separate tag for markup, since markup is allowed within <text>.

  • Hey cool, I'm in SFU CS right now. Did a job interview with Microsoft a few years ago, but I wasn't really close to graduating at the time.

     

    Bet you like and hate the same profs I do Big Smile

     

    Any chance of Razor ever working with F#? I'd imagine F#'s a big monster for something like this.

     

    Edit:

     

    By the way, F# could benefit from this thinking: "we're using the same parser at design time, and this is perfectly valid at design time; you don't want to lose track of your colorization..."

  • Sven GrootSven Groot Don't worry... I'm a doctor.

    When using XHTML 1.1 you should use application/xhtml+xml as MIME Type, but when using HTML5 with XHTML syntax you must use application/xhtml+xml.

     

    That is a problem since pre-IE9 don´t support application/xhtml+xml.

    I don't see why that's a problem since pre-IE9 don't support HTML5 anyway.

  • CKurtCKurt while( ( !​succeed=try​() ) ) { }

    Thx for all the detailed explenation. I really like the new syntax!

     

    Keep up the good work guys!

  • You can actually use some of the elements in IE 8 and earlier if you create the elements with JavaScript.

     

    For example:

     

    document.createElement('section');

     

    If you add that you can use CSS for the section element in IE 8, which you couldn´t before. You can also add a reference to Modernizr which makes it automatically (I use Modernizr on my own webpage to make it possible to view it in IE 8):

    http://www.modernizr.com/">http://www.modernizr.com

  • Luciano Evaristo GuercheguercheLE guerchele

    Is this a real treat or now kids are razoring Microsoft products Smiley

  • Luciano Evaristo GuercheguercheLE guerchele

    @Andrew Great achievement in just 9 months, by the way.

  • Hey reinux, it's always cool to meet a fellow SFUer Smiley.  Razor has a system for plugging in new code languages that we haven't quite finished working out yet, but in the next releases I expect to be able to add better support for creating new code languages without having to totally rewrite the parser.  Obviously, as a code language developer, you'd have to implement the logic to parse blocks of the new language, but you'd still get quite a bit for free.  Once that's cleaned-up a bit, one could absolutely add F# support Smiley

  • felix9felix9 the cat that walked by itself

    oh great, my question get read, cool ...... although the answer is not 'that' cool Smiley just speculation anyway

  • ZippyVZippyV Fired Up

    Since MVC is open-source and Razor will be included in the next version of MVC: will razor be open-source too?

  • Koistya `Navinkoistya RIA Guy | Koistya `Navin

    Hey Andrew! Great interview! A couple of questions though:

     

    1. Why do you guys use "@" sign for prefixing code blocks? For now I think that "#" sign would make more since..

     

    2. Will Razor apply original identation from master pages in nested layouts? Here is an example:

     

    Master page:

     

    <div id="body">
        @RenderBody()
    </div>

     

    Body Layout page

     

    <p>Body Content Line 1</p>
    <p>Body Content Line 2</p>

     

    a) Without preserving identation from the master page (like aspx parser does) it would render:

     

    <div id="body">
        <p>Body Content Line 1</p>
    <p>Body Content Line 2</p>
    </div>

     

    b) Ingoring identation it would render:

     

    <div id="body">
    <p>Body Content Line 1</p>
    <p>Body Content Line 2</p>
    </div>

     

    c) Preserving original identation from the the master page it would render:

     

    <div id="body">
        <p>Body Content Line 1</p>
        <p>Body Content Line 2</p>
    </div>

     

    I wish it would behave like the last one (option c)

  • XamlViewEngine

    Making the case for an XamlViewEngine for ASP.NET MVC

     

    I'm going commit the start of an XamlViewEngine on codeplex in the comming month.

  • Great interview Charles.  Always enjoy your interviews.

     

    Great to see the envelope is still being pushed with ASP.NET/MVC.  Our development team has been slowly skilling up on MVC and great to see MS continues to look for new possibilities.

  • CharlesCharles Welcome Change

    Thanks!
    C

  • 1. We discussed a number of options and ended up feeling that "@" was cleaner.  In the end, every character has its downside from an escaping perspective, so there's no perfect character to choose

     

    2. Right now, Razor is similar to ASPX in that it basically looks like option A.  This is something we've thought a bit about, but it's not likely to improve in v1.  The primary issue is that the markup indentation is something the parser would have to capture and pass on to the code somehow.

  • Erik PorterHuman​Compiler Now with more apps

    Yes.

  • Jocuri cu Hannah MontanaJocuri cu Hannah Montana

    Great article! Thank you for the great technical C++ 0x content on Channel9!!

Remove this comment

Remove this thread

close

Comments Closed

Comments have been closed since this content was published more than 30 days ago, but if you'd like to continue the conversation, please create a new thread in our Forums,
or Contact Us and let us know.