码迷,mamicode.com
首页 > 编程语言 > 详细

WEB开发编码原则:优化Javascript文件,并将其放到页面底部

时间:2015-08-16 10:53:24      阅读:124      评论:0      收藏:0      [点我收藏+]

标签:

在这篇博文中指出:

 1、整个页面文档家在结束才开始加载css和js以及其他的数据

 2、当顶部的所有js都家在结束之后才可以加载页面中的图片

 3、顶部的common.css和common.js几乎是同时开始加载

 4、底部的loader-min.js和离他最近的footer.jpg也是同时开始加载

 

从这里面可以得出的结论是

1、尽量减少整个document的大小和顶部css的大小,加快他们的加载,甚至在整个页面比较小的情况下可以将css放在底部。

2、javascript放在底部,这样就可以和图片几乎同时下载,让图片尽快的下载下来


回复感觉也很有道理:

22 楼 fighter_Jon 2010-11-01  

优化应该是个权衡的过程 
js放在底部是防止js对之后资源造成阻塞 
但是如果是web app应用部分js也需要放在head部分 保证页面功能完整 而不是页面先行 

13 楼 smildlzj 2010-10-30  

PS... 
LZ知识没学好.. 
每一个读取js,css,图片什么都是一个http连接,关长连接啥事... 

CSS尽量放头部, 
js尽量放最后(不过一般还是会放头部) 
css,图片会并行下载

10 楼 Saito 2010-10-29  

嗯.hoooooooooopo说的没错. 

http1.1规范里面建议每个domain两个连接并行下载.所以可以把图片什么的分域名. 

脚本会阻塞的原因是: 浏览器不知道脚本会不会修改DOM. 比如脚本里面可能会call document.write. 

技术分享 

根据yahoo YUI团队总结的网站前端优化14条原则,是将脚本放在底部,将样式表放在顶部。 

原因: 
浏览器在下载js的时候不能并行下载,会阻塞其他资源的下载,这样导致整体响应时间变长

2 楼 zhxing 2010-10-28  

据我所知,这个是由于解析hmtl的解析器有关。。
把js (不关键服务)放在底部--因为解析html 是顺序解析的,可以放到最后解析
把css 放在最头部--因为css早点加载有利于页面的展示,css后加载,页面排版不全都乱了。


WEB开发编码原则:优化Javascript文件,并将其放到页面底部

标签:

原文地址:http://my.oschina.net/sikou/blog/493079

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!