javascript - 为什么把scripts放在文档的尾部可以加快页面加载速度?
高洛峰
高洛峰 2017-04-10 14:35:08
[JavaScript讨论组]

bootstrap的模板页view-source:http://v3.bootcss.com/examples/starter-template/中把bootstrap核心的js放在了文档的尾部,并没有放在head里面,说是会加快加载速度,这是为啥?

高洛峰
高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...

全部回复(4)
黄舟

由于页面是单线程的,当脚本的位置在head中时,且没有添加async或者defer的话,脚本就会被下载或者执行。这回阻塞页面的渲染。如果脚本的执行时间过长,或者出现错误时等情况时,都会导致页面有一段空白期,这样给用户造成页面没加载的错觉。这无疑对用户体验来说是糟糕的。当脚本放在body的最下面加载时。当脚本执行的时候,那就说明页面的dom树已经渲染完成。能程序一个较完整的页面给用户。这也就是用户感觉加载快了的原因。

迷茫

浏览器在下载js的时候,会阻塞页面渲染,放在尾部会先显示页面再加载js,百度一下即可。

迷茫

浏览器加载js是同步加载,如果放在head里,会阻塞其它文件的加载及dom渲染,如果dom节点还没加载完成,且js里有引用某个dom节点,会报错。

巴扎黑

楼上的回答也有失偏颇,不一定所有的js都必须放在footer中,如果涉及到页面渲染方面的js还是必须放在head中,比如:

$('#main_wrapper').css({left:$(window).width()/2-480});//这种涉及到页面css渲染的js,需放在head中
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号