Geek asks and answers

ASP.NET MVC 3 dispatches <head> before <body> renders

I have an asp.net mvc application that uses a razor viewer mechanism.

I want to send my head to the browser, before drawing the body, start parallel loading of css, js and images related to css. (You can see how this technique works on /qaru.site / ... in the developer’s chrome tools - for example, on the network) I found a question about this in asp.net web forms: Send a head in front of the body to load CSS and JS as soon as possible I tried to use this solution, but it does not work.

For a razor motor, the following sequence of steps is valid:

  • action returns the result of viewing
  • _ViewStart.cshtml executes (sets ViewBag.Layout)
  • viewing is performed from the first line to the last (with inclusions and sections of code)
  • viewing the engine checks the ViewBag.Layout and if it is found, it executes the layout (with the body and renderind sections)

I believe a good solution is to split step 3 into 3 parts:

  • creating content for the Head and Css section
  • send to browser
  • creating another part of the view

Another solution is to statically include all.css and basic.js files in (without the contents of sections generated from the view), send a header, and then generate the view (with the FooterScript generation section).

, . : () - () - () - () - (). : Layout (head + flush) - view (all) + Layout (body).

_Layout.cshtml:

<html @Html.Raw(ViewBag.xmlns)>
    <head>
        <title>@ViewBag.Title</title>
        @Html.Partial("_MetaTags")    
        <link href="@Url.ThemeCss("jquery-ui-1.8.18.custom.css")" rel="stylesheet" type="text/css" />
        <link href="@Url.Css("masterPage.css")" rel="stylesheet" type="text/css" />          
        <link rel="shortcut icon" href="/favicon.ico"/>

        @RenderSection("Css", required: false)
        <script src="@Url.CommonScript("jquery.common.min.js")" type="text/javascript"></script>
        <script src="@Url.Script("Master.js")" type="text/javascript"></script>        
        @RenderSection("Head", required: false)    
    </head>

    <body>
        <div id="pageWhithoutFooter">    
            <div id="main">
                @RenderBody()
            </div>
        </div>
        @RenderSection("FooterScript", required: false)
    </body>
</html>

Howto?

+3
1

, :

PartialView("_PageHeader").ExecuteResult(ControllerContext);
Response.Flush();

// Generate model

return View(model);

, , .

+3

More articles:


All Articles