Javascript 在企业应用程序框架中包含js/css文件的最佳实践是什么？

我正在ASP.NET MVC3中进行企业应用程序开发。当然，我有不同的主布局和多个视图

我的担忧

• 在主布局中包含所有js/css文件可能会影响页面的性能
• 在视图中包含文件（如果需要）会创建重复引用（启动jquery/其他库）
• 引用越多，客户端和服务器之间的来回请求就越多，这反过来会影响输出页面的性能

我的想法

创建所需资源的自定义列表并将其存储在ViewBag中。让主布局引用此对象以包括js/css文件

或者添加引用某个键（用于标识呈现页面的唯一值）的操作的链接，并以单个响应的形式动态生成包含所有必需资源的输出。并使用用于后续请求的唯一键缓存输出（inmem/staticfile）。一种自定义资源绑定

请分享您的想法，欢迎提出任何想法和建议

编辑：2012年9月17日

下面的答案更多地讨论了web应用程序开发世界中的优化技术——感谢这些答案

我想从架构的角度进行讨论，重点是创建呈现页面所需的动态资源集合

例如，在特定视图中，我想使用jQuery UI，它需要jQuery-UI-1.8.11.min.js；在某些视图中，我想使用MVC3 ajax，它需要MicrosoftMvcAjax.js和jQuery.unobtrusive-ajax.min.js

我不想在主布局中包含永久引用，这将导致为所有视图加载这些js。相反，我希望在运行时包含动态js文件

希望这可能会增加清晰度

---

感谢您的帮助-Vinod

您需要首先考虑减少下载量：

• 将所有js和css放入尽可能少的文件中。这是因为客户端一次只能打开2个HTTP通道（大多数浏览器现在支持更多信息），在此之后的所有文件下载都将排队，直到前一个下载完成
• 你的js和css

一旦你把它缩小到一个合理的尺寸，你就可以考虑上面的问题了。您想要下载的内容量最小，因此在主控中。这将提高性能，因为客户端可以缓存它。缓存是一件好事，这可以避免客户端每次访问站点上的页面时都需要请求js和css

您可能还想考虑应用HTTP到期头

雅虎在很多方面都做得很好：

另外不要将js放在viewbag中。这是服务器上不必要的开销和负载。只需在页面中添加一个引用即可

---

MVC4现在支持在主布局页面中包含库。这样，您就不必担心只在需要的地方包含它，并且可以使用该框架向站点内的任何页面添加任何功能。。。你想过怎么做吗？好的缓存可以解决您的问题。Kyle，谢谢您的回复。但这是我首先关心的问题。我不想在主布局中添加所有库—这是一种性能问题。您计划添加多少库？您需要研究库的缓存，正如Sampo所建议的那样。仅仅在一些页面上包含它并不是一个明智的方法。常见的lib被添加到主布局中。某些页面仍然需要专用库。例如，如果一个页面需要cookie处理或拖放功能，我希望包含这些js文件。+½用于应答中包含的工作（另外½用于不忘记yepnope的缓存功能）；）+我的回答很好。另一方面，如果这是一个你宁愿不处理的事情，考虑一个第三方解决方案，比如CuldFLARE.ASP.NETMVC4支持资源捆绑，决定将项目升级到MVC4。