我正在使用一个MVC应用程序,该应用程序有大约10个BIG JavaScript库(jquery,modernizr,knockout,flot,bootstrap ...),大约30个jQuery插件和每个视图(数百个)拥有它自己的相应Javascript文件。
使用默认的MVC4捆绑,但所有这些JavaScript文件都打包在两个捆绑包中;一个包含所有插件和库,一个包含视图特定文件。无论是否需要,这两个捆绑包都会加载到每个页面上。
现在,它们仅在用户第一次打开应用程序时加载,但即使缩小了两个大约300 KB(更原始的方式),并且大部分代码非常特定于某些页面。
那么,对于浏览器来说,拥有2个巨型捆绑包,或创建特定于页面的“更智能”和更轻的捆绑包更好吗?但是它们有更多?浏览器会先缓存它们他们被打开的时间,但每页加载的javascript少于每页加载的所有javascript有什么性能优势吗?
答案 0 :(得分:0)
如果有任何机会不需要他们进行会话,那么将它们分成更小的包是有意义的。显然,你不必发送的任何字节都是好的字节;)
关于缓存有点消除这个问题,因为一旦你可以缓存它就需要它,但是,例如,如果你有一个日历页面和一个新闻页面,那么可以想象有人根本不关心日历,因此加载它是没有意义的。
也就是说,你可能会过分分裂,而且创建每个新请求所产生的开销将比你不能一次加载更大的库所节省的费用多。
答案 1 :(得分:0)
文件的大小与浏览器本身无关,页面大小整体上与用户的计算机相关,它会影响处理器,网络和内存(其中3个组件的性能将在某种程度上依赖于使用的浏览器。)
许多小文件可能会对慢速客户端提供更好的响应,因为文件下载并执行,而不是等待下载大文件(等待分配内存以读取文件)和执行脚本。 / p>
如果您想要更精简的Web应用程序,人们可能会建议您轻松使用脚本和插件。
答案 2 :(得分:0)
像sprite和JS捆绑这样的概念是由于最小化HTTP请求的目标而发明的。每个HTTP请求都有一个开销,可能会导致瓶颈,所以最好有一个大包而不是许多小包。
话虽如此,正如Grdaneault所说,你不希望用户加载他们不会使用的JS。
所以最好的方法是将所有常见的东西捆绑成一个,然后为不常见的东西单独捆绑。每个视图可能捆绑,取决于您的结构。但是不要让你的包重叠(例如,包A包含文件A和B,包B包含文件A& C),因为这会导致重复加载。
虽然有30个插件,哇。初始负载只是要解决的许多问题之一。仔细想想你是否需要它们 - 不是每个人都有一个像你希望的那样高效的环境!