¿Cuál es la mejor práctica para incluir archivos js/css en un marco de aplicación empresarial?

I am working on an enterprise application development in ASP.NET MVC3. Of-course I have different master layouts and multiple views.

Mis preocupaciones

  • Including all js/css files in master layout might affect the performance of the page
  • Including the files in views (where it is required) are creating duplicate references (kick-off jquery/other libraries)
  • More the references, the more the back&forth requests between client and server - which in turn affect the performance of the output page

Mis pensamientos

  1. Create a custom list of required resources and store it in ViewBag. Let the master layout refer this object to include the js/css files
  2. Or add the link referring an action with some key (an unique value to identify the page being rendered) and dynamically generate an output with all required resources as a single response. And cache the output (inmem/staticfile) with the unique key for succeeding requests. A kind of custom resource bundling.

Please share your ideas, any thoughts and suggestions are welcome!

EDIT: Sep.17.2012

Below answers are more talking about optimization techniques in web application development world - appreciating those answers.

I would like to discuss from an architectural perspective, focusing on creating a dynamic resource collection required by the page being rendered.

For example, in specific views I would like to use jQuery UI which requires jquery-ui-1.8.11.min.js, and in certain views I would like to use MVC3 ajax which requires MicrosoftMvcAjax.js and jquery.unobtrusive-ajax.min.js

I don't want to include permanent reference in master layout, which will result in loading these js for all views. Rather I would like to include the js files dynamic during runtime.

Hope this might have added clarity!

Thanks for the help - Vinod

preguntado el 28 de agosto de 12 a las 08:08

Include the libraries in the master layout pages. This way you don't have to worry about including just where it is required and can add any functionality using that framework to any page within the site. -

Caching... have you thinked about how it is done? Good caching may solve your concerns. -

Kyle, thanks for you reply. But that is my first concern. I don't want to add all libraries in master layout - a kind of performance concern. -

How many libraries are you planning to add? You need to look into caching of the library, as suggested by Sampo. Including it on just some pages isn't a wise way forward. -

Common libs are added in master layout. Still certain page requires exclusive libraries. For example if a page requires cookie handling or drag-n-drop feature, I would wish to include those js files. -

1 Respuestas

You need to think about reducing your download size first:

  • putting all your js and css into as few files as possible. This is because a client can only open 2 HTTP channels (most browsers now support more, info aquí) at any one time, all file downloads after this are queued until the previous ones finish downloading.
  • minify your js and css.

Once you've got this down to a reasonable size then you can think about the above. You want to download, the smallest amount of content upfront, so en el maestro. This will improve performance because then the client can cache it. Caching is a good thing, this stops the client having to request the js and css every time they visit a page on your site.

You might also want to think about applying HTTP expiry headers.

Yahoo do a good site on lots of these ideas: http://developer.yahoo.com/performance/rules.html

También don't put your js in the viewbag. This is unnecessary overhead and load on the server. Just add a reference in your pages!

MVC4 now supports agrupación

Respondido 16 Jul 20, 10:07

+½ For WTFPL work included in answer (and another ½ for not forgetting yepnope's caching abilities);) - Sampo Sarrala - codidact.org

+1 great answer. On a side note, if this is something that you would rather not handle consider a 3rd party solution such as CloudFlare. - scott bartell

ASP.NET MVC4 supports resource bundling, decided to upgrade the project to MVC4. - eka

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.