在 HTML 文件中放置 JavaScript 的什么位置？

javascript html optimization

2022-08-30 00:56:41

假设我有一个相当沉重的JavaScript文件，压缩到大约100kb左右。通过文件，我的意思是它是一个外部文件，可以通过链接，而不是粘贴到HTML本身。<script src="...">

在 HTML 中放置此内容的最佳位置在哪里？

<html>
<head>
    <!-- here? -->
    <link rel="stylesheet" href="stylez.css" type="text/css" />
    <!-- here? -->
</head>
<body>
    <!-- here? -->
    <p>All the page content ...</p>
    <!-- or here? -->
</body>
</html>

每个选项之间是否有任何功能差异？

答案 1

Yahoo！卓越性能团队建议将脚本放在页面底部，因为浏览器下载组件的方式。

当然，Levi的评论“就在你需要它之前，而且不早”确实是正确的答案，即“视情况而定”。

答案 2

最好的地方就在你需要它之前，而且不早。

此外，根据用户的物理位置，使用亚马逊的S3服务等服务可以帮助用户从物理上比您的服务器更靠近他们的服务器下载它。

你的js脚本是像jQuery或原型一样的常用库吗？如果是这样，有许多公司，如谷歌和雅虎，都有工具在分布式网络上为你提供这些文件。