Managing view page scripts in ASP.NET MVC

Question

I wanted to get your opinion about managing scripts in ASP .NET MVC. There are 2 problems I am particularly curious about:

Tracking script include dependencies of views
Managing and minifying view scripts

Just like in many projects my views are composed of several partial views and editor templates. I like to keep the scripting relating to these views in the same code entity e.g.

SigningKeysForm partial view should have its own JQuery/JQueryUI scripts.

Which means any view which renders this partial view should include JQuery/JQueryUI script files.

Also another issue is when a view is composed of several such partial views, it means the javascipt in the partial views will be in several locations in the generated html.

My current approach to these problems is exploiting the top down parsing of views in ASP .Net MVC.

For tackling first problem I define a HtmlHelper extension to include a script e.g.

<% Html.RequireScript(Scripts.JQuery); %>

This way in each partial view and view I explicitly call out which scripts are required. The implementation of this method is to create a HashSet on current HttpContext and add the required script there.

In my master page I have another HtmlHelper extension which checks the HttpContext and renders the script include tags e.g:

<%=Html.RenderScriptIncludeTags()%>

This way I can track the requirements of views and render only the required script includes.

For the view scripts I am employing a similar approach. I use a custom Asp .Net user control which instead of rendering its content stores the script content into a buffer on HttpContext e.g:

 <mvc:script runat="server">
     $(function(){
          alert("Hello " + "<%=Model.Name%>");
     });
 </mvc:script>

Again in the Master view I have a HtmlHelper extension which minifies (if needed) the stored scripts and renders them e.g:

  <%=Html.RenderScripts()%>
 </body>

I think this works as a solution, but it requires the script includes and scripts to be in the bottom of the master page. This means the script includes are not in the head section.

I want to know if there are better ways to manage the script requirements and in view page scripts with ASP .NET MVC.

Danny Tuppeny · Accepted Answer · 2012-01-22 12:44:32Z

3

Have you thought about using an existing tool that does this sort of thing, like Cassette (previously called Knapsack)?

Cassette automatically sorts, concatenates, minifies, caches and versions all your JavaScript, CoffeeScript, CSS, LESS and HTML templates.

I haven't personally used it (yet), but it looks pretty good, and seems like it should do exactly what you need (and more). Worth noting there is a small cost for commercial use.

EDIT: Now released under MIT licence :)

edited Jan 22, 2012 at 12:44

answered Oct 6, 2011 at 18:25

Danny Tuppeny

42.9k25 gold badges162 silver badges294 bronze badges

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

3 Comments

Ryan Over a year ago

How would you load your scripts in parallel with Cassette?

Danny Tuppeny Over a year ago

Note: It's not MIT, not GPL+commercial :-)

Danny Tuppeny Over a year ago

@Ryan The idea is that Cassette bundles it into a single request, so there aren't multiple scripts to load :-)

Carl R · Accepted Answer · 2011-10-06 18:49:01Z

1

Telerik has a script registrar utility that does exactly what you are doing.

http://www.telerik.com/help/aspnet-mvc/web-assets-working-with-javascript-web-assets.html

As a bonus, it also does compression.

Yes it renders the scripts at the bottom.
Personally I usually include a few important scripts on the top the usual way and the rest with the scriptregistrar. That way I can have some scripts available during the loading of the page.

The telerik script registrar is part of their MVC suite. http://www.telerik.com/products/aspnet-mvc.aspx

edited Oct 6, 2011 at 18:49

answered Oct 6, 2011 at 18:43

Carl R

8,2245 gold badges52 silver badges83 bronze badges

1 Comment

Achilles Over a year ago

Telerik's Registrars won't minify. They'll only combine and gzip-compress your stuff.

Collectives™ on Stack Overflow

Managing view page scripts in ASP.NET MVC

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related