在底部加载JS的好处,而不是文档的顶部

什么是真正的好处(如果有的话)加载你的JS在文档的底部,而不是顶部。 看起来页面加载和JS依赖function有一个短暂的延迟。

我正在使用html5boilerplate开始我所有的模板,但是我不确定在底部加载JS的好处。

它是否真的使所有的差异,如果是这样,为什么?

  1. 如果您在页面底部包含外部js文件,那么您将HTTP请求的优先级给予将呈现给客户端的视觉显示,而不是交互或dynamic的逻辑。 我相信,如果您不使用内容传送networking将图像传送到客户端,则一次只允许处理最多2个HTTP请求。 你不想浪费这些请求的逻辑,因为我们都知道最终用户是多么不耐烦。

  2. 通过在文件的末尾加载js,您可以访问DOM(大部分时间),而无需调用document.ready()函数。 你知道,如果页面渲染最终使你的JavaScript代码,必要的页面元素通常已经加载。

还有其他几个原因,但是当我觉得把所有的js放在最后的时候感到非常尴尬的时候,我会记住这些重要的原因。

当所下载的脚本正在下载时,浏览器通常不会并行下载其他文件,从而减慢了页面加载速度。

请参阅: 加快您的网站的最佳实践

谷歌search将返回大量的结果,为什么你想这样做,你会看到什么改善。 看看下面的一些链接:

  • 高性能网站:规则6 – 将脚本移到底部
  • Rails最佳实践:底部的脚本

基本上,这样做的主要原因是您将改善页面的渲染时间。 从第一篇文章:

我最好把脚本从页面顶部移到页面底部。 一个原因是启用渐进式渲染,而另一个是实现更大的下载并行化。

取决于js中的内容。 如果只是希望在页面加载的时候“去”,或者用jquery的$(function(){})来包围你的代码,或者把它放在页面的底部