Question

我最近看到，为了加快网页加载，最好将JavaScript链接放在最后。我做了，但现在引用文件的功能不起作用。如果我把链接放在页面的开头，一切都很好。

将JavaScript放在最后只能在某些情况下工作吗？

Answer 1

我也经历了一些测试。如果你正在加载一个Javascript文件，最好把它放在最后但是它确实带来了一些重要的警告。

首先，这样做通常会使我的一些视觉效果变得明显。例如，如果我使用jQuery格式化表格，那么表格将无法格式化，然后代码将运行以重新格式化它。我没有发现这是一个很好的用户体验，而是希望页面完整。

其次，将它放在最后会使代码难以放入页面中，因为通常还没有函数存在。如果您的页面中有此内容：

$(function() {
  // ...
});

在定义jQuery对象之前，这将无效。如果它在页面末尾定义，则上面会产生错误。

现在您可以争辩说，所有样式代码都可以放在外部文件中，但出于性能原因这将是一个错误。我开始在一个项目上执行此操作，然后发现我的页面花了一秒钟来浏览所有已集中的Javascript。所以我为相关行为创建了函数，然后在每个页面中调用了相应的函数，将Javascript加载运行时间减少到50-200ms。

最后，您可以（并且应该）通过对Javascript文件进行版本控制然后使用远期期限Expires标头来最小化Javascript的加载时间，这样它们只会加载一次（每次更改时），此时他们在档案中基本上是无关紧要的。

总而言之，我发现将Javascript文件放在文件的末尾是很麻烦的，最终是不必要的。

Answer 2

你必须注意顺序，但像JQuery这样的库可以很容易地做到正确。在页面的末尾，包含您需要的所有.JS文件，然后，在单独的文件或页面本身中，将Jquery调用放在页面内容上。

因为JQ处理css样式的选择器，所以很容易避免页面主体中的任何Javascript - 而是将它们附加到ID和类。这称为Unobtrusive Javascript

Answer 3

我记得的每个Yahoo YUI示例文件都有几乎最后的所有JavaScript。例如，

看起来Yahoo Practice大致是“＆lt; body＆gt;开头的库代码，＆lt; body＆gt;末尾的活动代码”。

请注意，这可能会导致Flash of Unstyled Content综合症。