代码之家 › 专栏 › 技术社区 › user

网页底部/顶部的javascript?

webpage javascript

user · 技术社区 · 16 年前

我只是在为Mozilla火狐使用插件“yslow”,它告诉我应该把javascript放在底部。我以前听过这个,但没想太多。与顶部相比,将javascript放在网页底部真的有优势吗?

9 回复 | 直到 7 年前

wojo 16 年前

它将允许网页在执行javascript之前以可见的方式加载,这对谷歌分析(Google Analytics)等在加载网页之前不必发生的事情是有意义的。

您可能还需要查看jquery、原型等内容,并附加到“ready”处理程序,该处理程序在DOM完全加载后执行javascript代码,这对于许多javascript代码来说是一个合适的位置。

Leniel Maccaferri 13 年前

假设您没有在cdn上运行,或者没有从单独的子域或服务器上为您的js提供服务,那么它将同步加载,并强制您的HTML内容等待,直到下载完文件。通过在关闭前将JS放在页面底部 </body> 标记,您允许在加载JavaScript之前解析HTML。 这会加快页面加载时间。

Brian Moeskau 16 年前

如果您有静态的HTML内容和大量的javascript,那么它可以在感知的页面加载时间上产生差异,因为HTML将首先加载,给用户一些可以查看的东西。如果您没有太多的javascript,或者现有的页面内容依赖于javascript才有用,那么实际上,这就没有那么有用了。

Mauno Vähä 13 年前

我想更新这个话题,谷歌最近推出了异步截图 http://support.google.com/analytics/bin/answer.py?hl=en&answer=1008080&rd=1 它可以添加到您的站点上,以提供例如google统计支持。它应该放在 <head> 以获得最佳性能。关键是这增加了在用户离开页面之前发送跟踪信标的可能性。

如果你想用你的google分析在google网站管理员工具中验证你的网站,它也应该在那里。

除此之外,同样的规则基本上仍然适用——底部的javascript用于“快速”加载页面。我使用引号是因为在javascript完成之前,我不计算页面是否已完全加载;-)

CodeJoust 16 年前

是的,页面将在加载和执行JavaScript之前加载并呈现内容,因此页面将更快地加载。

Umar AlFarooq 9 年前

它允许所有的DOM元素在加载针对它们的javascript之前完全加载。此标准也是Visual Studio的一部分。

Aakriti Kishore 9 年前

将脚本放在元素的底部可以提高显示速度,因为脚本编译会减慢显示速度。

ivanleoncz velhala 7 年前

顶部

当您将JavaScript放在页面顶部时,浏览器将开始在标记、图像和文本之前加载JS文件。由于浏览器同步加载javascript,因此在加载javascript时不会加载任何其他内容。因此,在加载JavaScript时,用户将看到一个空白页面,时间为几秒钟。

底部

另一方面,如果将javascript放在页面底部,用户将首先看到页面加载,然后javascript将在后台加载。例如,如果您的css&html需要5秒钟加载,而您的javascript又需要5秒钟,那么将我们的javascript放在页面顶部会给用户一个__percepted_加载时间为10秒,放在底部会给用户一个__percepted__加载时间为5秒。

取自 Demian Labs .

raj240 7 年前

是的,包括页面底部的javascript确实加快了页面的加载速度。因为浏览器是同步执行的,所以如果它放在页面的顶部,它会影响页面加载。如果它放在页面底部,那么当浏览器开始加载javascript时,页面就会加载整个标记,从而为用户提供更好的体验。