一个大的javascript文件或多个较小的文件?

时间:2013-03-06 00:24:38

标签: javascript jquery performance web

好的,所以我有一个合理的大小项目,我正在使用jquery主干和其他一些javascript库。我想知道我的javascript库是否应该有一个文件而我的自定义代码应该有另一个文件。或者一堆单独的javascript文件。

7 个答案:

答案 0 :(得分:73)

通常最好减少HTTP请求。因此,您应该尽量减少文件数合理

我个人的偏好是拥有三个“小组”的JavaScript文件:

  1. 核心档案。包含几乎在任何地方使用的函数和其他有用的页面初始化内容。
  2. 模块文件。包含在多个地方使用的代码,但不是在任何地方。可以放入以提供其他功能。例如,如果您有一个脚本来处理日期输入,您可以将其包含为模块文件并将其添加到具有日期输入的页面。
  3. 特定于网页的文件。这些文件包含仅在一个地方使用的代码。它们作为单独文件添加而不是作为页面本身的一部分的唯一原因是出于缓存原因。

答案 1 :(得分:12)

一个大文件。你应该在生产代码时缩小代码并在代码大时将其压缩。您希望尽可能少地向服务器发出请求以提高页面性能

答案 2 :(得分:9)

一个大文件或两个文件:一个小文件和一个大文件。 需要明确的是,在开发过程中,最好有单独的文件 - 可能使用requireJS之类的东西。但是当你部署它时,最好将所有内容压缩到一个文件中,以减少HTTP延迟和请求。

我提到了两个文件。在某些情况下,可能有一个小文件,它负责“引导”操作,同时“大文件” - 特别是如果真的大 - 下载。 这对于第一次访问尤其有用,因为用户尚未缓存您的文件。

答案 3 :(得分:8)

最好把它分开,但不要过分热心。这样您以后可以重用库代码。此外,每个人都喜欢使用单独的文件,因为它使事情更有条理。

也就是说,最好给用户一个压缩文件,以便可以轻松缓存所有内容,这也减少了页面请求的数量。例如,Rails 3在资产管道中自动执行此操作。您可以编写一个脚本来运行您喜欢的压缩器。但是你不应该牺牲代码的可读性 - 你可以吃蛋糕并吃掉它!

答案 4 :(得分:0)

正如所建议的那样,使用较小的文件很好,但对于生产代码,您的构建过程应该包括优化。部分优化应该是通过组合成单个js文件来减少文件大小和网络流量优化,以减少浏览器的调用。

答案 5 :(得分:0)

作为一项规则,我尽可能少地减少向服务器发出的请求数量。

答案 6 :(得分:0)

取决于您的应用程序的大小。但通常总是更好地将您的javascript文件分组,以获得更好的可维护性和可重用性。

您可以使用像RequireJS这样的JS模块加载器来加载JavaScript。至少会组织这些文件。您可以通过确保可以在用户的​​浏览器上缓存这些文件来提高服务器性能,以便他们只下载一次。