性能加载js文件

时间:2009-12-11 17:33:22

标签: javascript performance

我想知道什么是最好的。我有不同的JS函数,例如我有手风琴插件,联系页面的脚本。但我只在一个页面上使用每个脚本,例如'faq page'使用手风琴JS但显然不是联系人JS。 这和其他许多例子一样(我的js dir总共460kb,分成不同的文件)

那么什么是最好的,将所有脚本放在一个文件中并将其加载到我的标题模板中,或者将它们分成大约10个不同的文件并在需要时加载它们?

此致

5 个答案:

答案 0 :(得分:1)

您想将它们全部放在一个文件中。它减少了到服务器的次数,减少了开销。

通常建议将它们放在文档的末尾,以便预先下载页面的其余部分。

这是一个链接,描述了雅虎在哪里包含脚本以及最大限度地减少到服务器的访问的最佳实践。 http://developer.yahoo.com/performance/rules.html

答案 1 :(得分:0)

“最佳”通常不是一刀切。

将文件合并在一起意味着更少的连接和(假设您的缓存设置正确)它将允许您的第一个页面视图点击,然后所有其他页面将受益。

将它们拆分可以在缓存方面提供更多的粒度,但它需要花费很多连接(每个连接都有与之相关的开销)。请记住,许多浏览器只与任何给定的主机名建立2个连接。这是HTTP规范强加的旧限制。

通常情况下,“最佳”是找到将它们分成足够大的组的方法,对于任何一个页面,您不会下载太多额外的内容,但是您可以在页面之间共享很多内容。因为担心下载太多而不喜欢群体。

无论您采用哪种方式,请确保压缩脚本(删除空格,注释等),为其提供GZip或Deflated,并适当设置过期标头,以便用户不会下载相同的脚本结束了。

答案 2 :(得分:0)

我会根据在任何地方或仅在某处使用的内容将其分为几个或三个文件。

此外,使用这么多代码,您应该考虑缩小代码以减少下载时间。我之前使用过YUI Compressor,做得很好,很容易集成到构建文件中。

答案 3 :(得分:0)

将它们合并为一个文件 - 这将意味着更少的HTTP请求。

但是,在CSS和JS文件上设置过期标头非常重要。您应始终设置这些标头,但如果您强迫用户重新下载每个页面加载的10个文件的内容,则会特别糟糕。

答案 4 :(得分:0)

如果您真的只在一个页面上使用每个功能,那么将它们组合到一个文件中就不会获得太多收益。加载访问者首先访问的页面需要更长的时间,但后续页面的加载速度会更快。

如果大多数脚本仅在几个页面上使用,那么可能有必要确定访问者可能首先访问哪些页面(主页,加上任何值得书签的页面)并为这些页面生成组合的js文件,因此他们尽快加载。然后只需在他们使用的任何页面上加载较少使用的脚本。