YSlow23条优化建议学习(一)将样式表至于顶部
2013-01-11 16:54
204 查看
在雅虎我们研究性能的时候发现,将样式表移到文档的顶部似乎会使页面加载的更快,那是因为将其放在文档的顶部会使页面持续的渲染(render progressively)
关心性能的前端引擎希望页面持续加载,也就是我们希望浏览器能够尽快的显示他的内容,对于那些内容很多的页面和网速不好的用户来说极其重要。有很多研究和文章提出用户视觉反馈(类似progress indicator)的重要性,这里HTML页面就是这个progress indicator,浏览器逐步加载的头部,导航栏,顶部的logo等等这些对于等待的用户来说就是视觉反馈,这些会改善整体的用户体验。
将样式表放在文档靠近底部位置,很多浏览器不会逐步加载,例如:IE。浏览器会阻塞逐步(render progressively)渲染来避免当样式表改变的时候得重画页面元素,用户此时会看到整块白的页面。
The HTML specification明确指出样式表应该被放在页面的头部:和a标签不同,a标签也许仅仅出现在文档顶部区域,尽管它有时候出现很多次。由于是不可替代的,整个空白的屏幕,flash,或者没有样式的文档都是很危险的。最好的解决办法就是遵循HTML规范以及将样式表放在文档的头部。
引用:http://developer.yahoo.com/performance/rules.html#css_top
关心性能的前端引擎希望页面持续加载,也就是我们希望浏览器能够尽快的显示他的内容,对于那些内容很多的页面和网速不好的用户来说极其重要。有很多研究和文章提出用户视觉反馈(类似progress indicator)的重要性,这里HTML页面就是这个progress indicator,浏览器逐步加载的头部,导航栏,顶部的logo等等这些对于等待的用户来说就是视觉反馈,这些会改善整体的用户体验。
将样式表放在文档靠近底部位置,很多浏览器不会逐步加载,例如:IE。浏览器会阻塞逐步(render progressively)渲染来避免当样式表改变的时候得重画页面元素,用户此时会看到整块白的页面。
The HTML specification明确指出样式表应该被放在页面的头部:和a标签不同,a标签也许仅仅出现在文档顶部区域,尽管它有时候出现很多次。由于是不可替代的,整个空白的屏幕,flash,或者没有样式的文档都是很危险的。最好的解决办法就是遵循HTML规范以及将样式表放在文档的头部。
引用:http://developer.yahoo.com/performance/rules.html#css_top
相关文章推荐
- YSlow23条优化建议学习(二)将脚本至于底部
- Yslow的23条前端性能优化建议Grade(等级视图)
- Oracle性能优化23条建议(欢迎补充)
- Yslow-23条优化原则
- SQL优化学习建议
- 【学习笔记】Mysql中锁定机制介绍及优化建议
- 前端学习笔记一:YSlow 23条规则
- 学习SQL优化的建议
- Jquery学习笔记--性能优化建议
- Hibernate学习之------>Hibernate性能优化的几点建议
- Yslow-23条规则(优化Web网站性能)
- mysql性能优化学习笔记-参数介绍及优化建议
- 【Java高并发学习】锁优化相关建议
- 来自yahoo的web优化规则(YSLOW的23条军规)
- MySQL优化建议--个人学习笔记
- web性能优化:将link样式表放在顶部,将script脚本放在底部
- yslow和pagespeed等具体优化建议
- 改善C++ 程序的150个建议学习之建议10:优化结构体中元素的布局
- Android之ListView原理学习与优化总结
- android系列学习:tab切换,fragment中嵌套listview,listview自定义item,优化以及onclick