提高页面访问速度 Posted on August 16th

转载 2007年10月03日 18:49:00
原贴:http://enissue.com/archive/50

提高页面访问速度 Posted on August 16th

速度是用户体验非常重要的一部分。如果说用户体验可以分成“能用、可用、好用”,能用就是后两者的基础。

大部分用户往往会死等一个网页出来,而很少会同时做其他事情。没有速度,如何向用户展示流程,如何带给用户进一步的体验呢?

Yahoo! Exceptional Performance团队在Developer Network上总结:80-90%的客户端响应时间都用于下载所有的页面元素:图片、样式表、脚本文件、Flash等等。

因此,加快页面响应速度,提高页面性能是提高用户体验重要的第一步。

Yahoo!最近提供了一个页面性能分析工具YSlow,以Firefox Add-on的形式集成到Firebug中。

装上这个工具后,它会分析页面加载的所有内容,根据加速站点的13条规则给站点页面评分并给出建议。

并且它会列出所分析页面上所有元素的类型:URL、过期时间、gzip状态、load时间、文件大小、ETag、包括HTTP响应报头,以及页面Empty CacheFull Cache时的数据。

Yahoo!页面加速的13条规则如下:(http://developer.yahoo.com/performance/rules.html#num_http

1. 减少 HTTP 请求

2. 使用 CDN

3. 为网页元素添加 Expires Header

4. 支持 Gzip

5. CSS 放在网页顶部

6. 把活动的脚本文件移到底部

7. CSS避免使用Expression语句

8. 使用外部 JavaScript CSS 文件

9. 减少 DNS 查表时间

10. 最小化 JavaScript

11. 避免网页跳转

12. 删除重复的脚本

13 .配置Etag

XXX站点首页的测试:

untitled.bmp

untitled2.bmp

 

相关文章推荐

压缩静态文件,提高页面访问速度

网站上线,发现在移动环境下访问速度比较慢,于是做了一些优化的措施,其中一项是压缩了静态文件,...
  • kyfxbl
  • kyfxbl
  • 2014年09月27日 18:03
  • 911

滚屏到相应位置才加载图片-优化页面访问速度

一个页面图片太多了就有压力。但如果总是分页,每页鸡碎那么多,用户又会很烦。 可以滚屏到相应位置才加载图片,这样就皆大欢喜了。 原理如下: 1、使用jquery 2、需要动态加载的增加一个属性(...

小强的HTML5移动开发之路(51)——jquerymobile中改善页面访问速度

在使用jQuery Mobile进行开发的时候可以选择单页模版和多页模版,在使用单页模版的时候从一个页面跳转到另一个页面的时候需要从服务器请求,用户会感到略有停顿。使用多页模版,可以改善页面跳转之间的...

提高Github访问速度的hosts文件

  • 2017年03月23日 11:19
  • 971B
  • 下载

滚屏到相应位置才加载图片-优化页面访问速度

一个页面图片太多了就有压力。但如果总是分页,每页鸡碎那么多,用户又会很烦。 可以滚屏到相应位置才加载图片,这样就皆大欢喜了。 原理如下: 1、使用jquery 2、需要动态加载...

Web开发中的三种缓存模式对页面访问速度影响和分析

Web程序性能优化有多个方面,比如sql优化、集群、负载均衡、购买更强悍的硬件、采用缓存框架等等办法。但是缓存框架就有很多种:页面静态化、JSP页面缓存、后台方法缓存、ORM查询结果缓存、数据库缓存、...
  • sinlff
  • sinlff
  • 2012年04月03日 22:19
  • 4739
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:提高页面访问速度 Posted on August 16th
举报原因:
原因补充:

(最多只允许输入30个字)