多个JavaScript / css文件：最佳实践？
我现在有大约7个Javascript文件（感谢各种jQuery插件）和4-5个CSS文件。 我很好奇，处理这些问题的最佳做法是什么，包括文档中应该加载的地方？ YSlow告诉我，JavaScript文件应该尽可能包含在最后。 身体的尽头？ 它提到的是分隔符似乎是他们写内容。 我所有的Javascript文件都是函数和jQuery代码（全部在ready（））时完成，所以应该是OK的。
那么我应该包括一个CSS和一个Javascript文件，并包含其余的？ 我应该把所有的文件连成一个吗？ 我应该把Javascript标签放在文档的最后？
编辑： FWIW是的，这是PHP。
我build议使用PHP Minify ，它可以让你为一组JS或CSS文件创build一个HTTP请求。 Minify还处理用于客户端caching的GZipping，Compression和HTTP Headers。
编辑：Minify也将允许您设置请求，以便为不同的页面，您可以包括不同的文件。 例如，一些核心的JS文件，以及某些页面上的自定义JS代码，或者是其他页面上的核心JS文件。
在开发过程中，包括所有文件，正常情况下，然后当您更接近切换到生产运行时，将所有CSS和JS文件合并为一个HTTP请求。 安装和操作起来非常简单。
还有，CSS文件应该设置在头部，而JS文件在底部，因为JS文件可以写入您的页面，并可能导致大量的超时问题。
这里是你应该如何包括你的JS文件：
</div> <!-- Closing Footer Div --> <script type="application/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.min.js"></script> </body> </html> 编辑：您也可以使用Cuzillion来查看您的页面应该如何设置。
这就是我所做的：我最多使用两个JavaScript文件，每个页面通常使用一个CSS文件。 我想知道哪些JS文件在我的所有页面上是通用的（或者足够多，所以它是closures的 – 包含jQuery的文件将是一个很好的候选人），然后我连接它们并使用jsmin-php缩小它们，然后caching合并文件。 如果只剩下那些特定于那一页的JS文件，我将它们串联，缩小并caching到单个文件中。 第一个JS文件将通过多个页面被调用，仅次于那一个或者几个页面。
如果你喜欢用css-min ，你可以使用与CSS相同的概念，尽pipe我发现我通常只使用一个CSS文件。 另外还有一件事，当我创buildcaching文件时，我在文件的开始部分放入一些PHP代码，将其作为GZip文件提供，实际上，您将获得大部分储蓄。 您还需要设置您的过期标题，以便用户的浏览器也有更好的caching文件的机会。 我相信你也可以通过Apache启用GZipping。
对于caching，我检查文件创build时间是否比我设置的时间长。 如果是，我重新创buildcaching文件并提供它，否则我只是得到现有的caching文件。
你没有明确表示你有权访问服务器端的解决scheme，但是假设你这样做了，我总是用一种涉及使用PHP的方法来完成以下工作：
jquery.js.php：
<?php $jquery = ($_GET['r']) ? explode(',', $_GET['r']) : array('core', 'effects', 'browser', 'cookies', 'center', 'shuffle', 'filestyle', 'metadata'); foreach($jquery as $file) { echo file_get_contents('jquery.' . $file . '.js'); } ?>
用上面的代码片段，我就像通常那样调用文件：
<script type="text/javascript" src="jquery.js.php"></script>
然后如果我意识到了我需要的精确function，我只需将查询string作为查询string（ jquery.js.php？r = core，effects ）即可。 如果他们是分支的话，我也会按照我的CSS要求做同样的事情。
我不会推荐使用基于JavaScript的解决scheme（如PHP Minify）来包含您的CSS，因为如果访问者禁用JavaScript，页面将变得无法使用。
缩小和组合文件的想法是伟大的。
我在我的网站上做类似的事情，但为了缓解发展，我build议一些代码如下所示：
if (evironment == production) { echo "<style>@import(/Styles/Combined.css);</style>" } else { echo "<style>@import(/Styles/File1.css);</style>" echo "<style>@import(/Styles/File2.css);</style>" }
这应该让您在开发过程中保持文件分离，以便于pipe理，并在部署期间使用组合文件以加快页面加载速度。 这假定您可以将文件和更改variables作为部署过程的一部分进行组合。
绝对考虑包括你的js在底部和css在顶部按照YUI的build议，因为保持JS低对页面的其余部分的外观有一个实际的影响，并感觉更快。
我也倾向于复制+粘贴我所有的jquery插件到一个单一的文件：jquery.plugins.js然后链接到
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js">
为实际的jquery库。
