javascript - 所有 JavaScript 代码都应该用 HeadJS 放在头部吗？

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 代码，并且需要在“装饰”脚本之前下载您的功能。

再次强调，只要它们不阻止其他 Assets (即 CSS 和内容)，它们什么时候开始下载就无关紧要了。

在OP，根据我的快速研究，你的方法似乎确实是正确的。据我所知，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 的条件负载(更不用说其他任何东西)时，我考虑将我的第一个 child 交给开发人员。