如何管理Javascript文件？

如今，除了我们自己编写的Javascript文件外，我们每页还有大量的Javascript库。你是如何管理它们的？如何有组织地缩小它们

首先

让他们有条理是由你决定的，但我所见过的大多数小组都提出了一个惯例，对他们的应用有意义

一般来说，最好是打包您的文件，这样您就可以在任何给定页面上包含少量包，以实现最佳缓存

---

你也可以考虑将你的JavaScript划分为<>强>容易共享的< <强> >。< /P> < P>我将有一个文件夹用于所有JavaScript，以及一个第三方/共享库的子文件夹，以及站点的每个组件的子文件夹以保持所有的组织。

例如：

/
+--/javascript/
    +-- lib/
    +-- admin/
    +-- compnent1/
    +-- compnent2/

---

然后在构建过程中通过缩小器/模糊器运行所有内容。

我最近一直在使用这个：

---

然后有一个“JScript”文件夹，在那里保存我的自定义代码

组织机构

我的所有脚本都保存在一个目录结构中，每当我在一个站点上工作时，我都会遵循这个目录结构。目录结构通常如下所示：

+--root
   |--javascript
      |--lib
         |--prototype.js
         |--scriptaculous
            |--scriptaculous.js
            |--effects.js
            |--..
      |--myOwnScript.js
      |--myOwnScript2.js

如果我在一个团队中工作时偶然使用了过多的脚本，那么我通常会创建一个自定义目录，在这个目录中我们将按关系组织脚本。不过，这种情况并不经常发生

压缩

虽然有很多不同的压缩器和模糊器，但我总是回到

包容

---

除非一个站点使用的是某种形式的母版页、CMS，或者一些规定了我无法控制的页面上可以包含哪些内容的内容，我只是为了小的性能考虑，才为给定页面添加了必要的脚本。如果一个页面不需要任何脚本，那么该页面上就不会包含任何脚本。

在我的上一个项目中，我们有三种JS文件，都在JS文件夹中

库代码。大多数页面上都使用了一组函数，因此它们被放在一个或几个文件中

课程。它们有自己的文件，根据需要组织在文件夹中，但不一定如此

临时JS。特定于该页的代码。这些文件保存在与它们应该运行的JSP页面同名的文件中

---

最大的努力是在前两种类型上拥有大部分代码，自定义代码只知道调用什么以及何时调用。

这可能是一种不同于您所寻找的方法，但我一直在玩弄在我们的博客引擎中使用JavaScript模板的想法。简而言之，您可以使用数据库将Javascript模板分配给页面id，它将动态地包含并缩小与该模板关联的所有Javascript文件，并在服务器端缓存中创建一个以模板id作为文件名的文件。加载页面时，它调用模板文件，模板文件首先检查文件是否存在于缓存中，如果存在，则加载。如果它不存在，它会动态创建并包含它。我还使用模板文件来gzip聚合JavaScript文件

模板的想法对于站点范围的JavaScript（比如JavaScript库）很有效，但它不包括特定于页面的JavaScript。但是，对于页面特定的JavaScript，您仍然可以使用相同的方法，方法是包含第二个文件，该文件的作用与上述相同。

Cal Henderson（Flickr名人）不久前写道。它涉及资产交付，而不是组织，但它可能会回答您的一些问题

以下是要点：

• 是的，您应该在生产环境中连接JavaScript文件，以尽量减少HTTP请求的数量
• 但您可能不想连接成一个巨大的文件；您可能希望将其分解为逻辑部分，并将传输成本分摊到多个页面上
• gzip压缩是好的，但您不应该为IE提供gzip资产来回答类似的问题。