是否应该使用HeadJS将所有JavaScript代码放在头部？

Question

我正在使用HeadJS来加载我所有的JavaScript代码在我的网站头部。我是否应该执行以下操作，用HeadJS将所有JavaScript加载到头部？

<script src="/-/js/head.js"></script>

<script>
    head.js("https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js")
        .js("/-/js/slideshow.js")
        .js("/-/js/modernizr.js")
        .js("/-/js/cookie.js")
        .js("/-/js/thumbs.js")
        .js("/-/js/infinitescroll.js")
        .js("/-/js/manual-trigger.js")
        .js("/-/js/easing.js")
        .js("/-/js/thumbs.js")
        .js("/-/js/popup.js")
        .js("/-/js/sharre.js")
        .js("/-/js/selectivizr.js")
        .js("/-/js/scripts.js");
</script>

此外，文件'scripts.js‘是我自己的jQuery脚本，它在头部使用了其他JavaScript脚本。这是运行优化的最好方法吗？

我用来包装这个文件中的所有代码：

head.ready(function() { my code });

Answer 1

正确的做法是并行下载资源，这样就不会有任何资源阻止其他资源的下载，例如阻止内容呈现的脚本。理想情况下，您应该先下载CSS，然后按照重要性/依赖性的顺序并行下载脚本。例如，您希望在下载与jQuery相关的脚本之前下载jQuery代码，并且在下载“装饰性”脚本之前下载您的功能。

同样，它们何时开始下载是无关紧要的，只要它们不阻止其他资产(即CSS和内容)。

在操作中，根据我的快速学习，你的方法看起来是正确的。据我所知，headjs可以并行下载，但可以按顺序执行(您可以指定顺序)。您所使用的方法将执行任何最先到达的脚本。你很有冒险精神！^_^

不幸的是，我不知道你的每个脚本的功能重要性，但我建议重新排序，比如：

<script>
head.js("https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js",
    "/-/js/modernizr.js",
    "/-/js/selectivizr.js",
    "/-/js/cookie.js",
    etc...
    );
</script>

这将并行下载脚本，但按此顺序执行。您需要使用,分隔每个脚本，才能使用“并行下载，按顺序执行”方法。

我认为:仍在调查-您还可以选择包含条件下载，使用：

head.browser.ie(insert scripts);

Check out the awesomeness.

当我看到Internet Explorer的条件加载时(别提其他事情了)，我考虑把我第一个出生的孩子给开发人员。

Answer 2

您应该始终尝试put your scripts at the bottom just before the closing body tag。