将 JS 放在 </body> 标记上方可以改善感知加载时间，因为浏览器不必在开始渲染页面之前读取和解析所有 JS。
但它还有另一个好处，不是吗？我们不需要将 JS 包裹在 $(document).ready(function() { ... }) 中，因为所有元素都已经在 JS 之上，因此可以进行操作了。
$(document).ready 是否需要确保 DOM 已完全加载并准备好进行操作？
执行时间有区别吗？一种方法会比另一种更快吗？
我们能否在页面底部也链接我们的外部 JS 文件 (<script src="..." />)，还是需要在页眉中？
【问题讨论】：
标签： javascript jquery performance optimization
这个 SO 回答说 NO：
$(document).ready 是为了确保在调用函数时完整的 DOM 可用。 任何不依赖于 DOM 的函数和事件都不需要放入 ready 事件中。
另外 - 为了提高页面渲染速度 - 以非阻塞方式动态加载 javascript 文件：http://berklee.github.com/nbl/ 或 https://github.com/rgrove/lazyload/
这种技术有点像这样：
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "file1.js";
document.getElementsByTagName("head")[0].appendChild(script);
这个新元素加载源文件 file1.js。将元素添加到页面后，文件就会立即开始下载。这种技术的重要之处在于，无论从哪里开始下载，文件的下载和执行都不会阻塞其他页面进程。您甚至可以将此代码放在文档的标题中，而不会影响页面的其余部分（除了用于下载文件的一个 HTTP 连接）。
这本书：Nickolas Zakas 的“高性能 JavaScript”有很多关于 JavaScript 性能优化的有趣信息。
【讨论】：