你的网站为什么会慢?——用YSlow为你的网站提速
在前面的文章我翻译的文章中分别从内容、服务器、JavaScript和CSS、图片、Coockies和移动应用等几个方面总结了34条提高网站性能的黄金守则,但是这些守则中,有一些是不常用到的,若非有实力的大型企业很难实现。对于小型网站,比如个人博客等在提高网站性能上可以首先考虑以下13条准则:
- 尽量减少HTTP请求
- 使用内容分发网络(CDN)
- 为文件头指定Expires或Cache-Control
- Gzip压缩文件内容
- 把样式表置于顶部
- 把脚本置于页面底部
- 避免使用CSS表达式(Expression)
- 使用外部JavaScript和CSS
- 减少DNS查找
- 削减JavaScript和CSS
- 避免跳转
- 剔除重复脚本
- 配置ETag
但是往往,一个网站不可能同时存在这些问题,最好能有一个工具可以为我们论断自己的网站存在的问题。幸运的是,Yahoo为我们提供了一款这样的工具——YSlow,你可以下这个网址去下载到最新版本。下面我们介绍一下他的安装和使用:
1、安装:
YSlow是Firefox的一个插件,目前还没有开发出IE版本,因此你必须装有Firefox 2.x版本。同时,YSlow是依附在Firebug上的,也就是说你的Firefo必须装有Firebug插件。如果你没有安装Firefox可以到Firefox官方网站上(注:目前还不支持 3.x)下载一个,同时可以到这里下载Firebug。
2、启用:
安装完成后,运行Firefox,会在右下角出现图标
,点击即启动。下面我们看看如何使用YSlow以及如何使用分析数据等。
2.1 在Firefox中载入你要分析的网站(如个人博客等,本文又作者的PJBlog程序为例),点击右下角的YSlow图标,启动YSlow,点击Firebug中“Inspect”旁边的“Performence”按钮,即进行分析。我们会看到如下界面:

在这个面板的最上侧 Performance Grade:F(48)为YSlow对你的网站的综合评分,共分为6个等级(A-F)100分制,其中F等级最低,也就是说网站性能最差,不利于用户体验,A级最高,即网站性能最能最优。下面的列表中共列出了13个选项,这13个选项就是为你网站进行打分的参考标准。在每一个选项的前面会有A~F的评分,同样F为最差A为最好。点击右侧的“三角图标”或者右上角的“Expend All”可以展开具体内容。其中标记F的需要改进的项。具体改进方法可以点击文章一开始的13条建议进行查看。
2.2 点击“Stats”按钮查看网站状态:
缓存包括对JavaScript、CSS、图片、静态文件等,此外还有整个网站访问过程中进行HTTP请求的次数、Coockie文件的大小等。图片大体如下:

在上面的截图中,“Empty Cache”和“Primed Cache”分别代表浏览器缓存为空和存在一定缓存时的页面访问情况。在上面的图中我们可以看出,如果我们的页面使用了缓存,那么在以后的访问中性能会有面试的提升,两图相比,有缓存的访问只会下载HTML文件、IFrame框架以及IFram中使用的Js文件(这就是我们在前面的文章讲到的“要使框架数量最少”
,因为它不能缓存。1175K大小的页面增加缓存后只需要下载81K的文件,同时原来需要发送72次HTTP请求,现在只需要发送4次HTTP请求,要知道HTTP请求是页面性能中最昂贵的代价,因此,越少越好。
在下面的饼状图中展示了各内容在访问中所占的比重。可以看出,在存在缓存的情况下,Flash、JavaScript、CSS、Images等都已经不需要再加载了,除非你按下了“刷新”按钮。
再接下来是Coockie的大小,一般说来Coockie要越小越好。
2.3 Components,查看页面内容
在这个选项卡中可以看到页面的各个组成部分,如所使用的图片、flash动画、JavaScript文件、CSS样式表等等。

其中Type为文件类型,如JS、iframe、cssimage(CSS中的图像文件)、Image(页面中直接引用的文件)等;URL即文件的来源路径、Expire来件过期时间或者在浏览器中缓存时间、Gzip文件是否使用Gzip压缩、RespTime请求时所需要的时间、Size文件大小(解压后)、ETag唯一标志。
2.4 此外,YSlow还为我们提供了一些有用的小工具,点击右侧的“Tools”按钮
如JSLint,一款Minify Javascript的工具,可以简化你的JavaScript文件的大小,如文件中的注释、换行、空格等都会被去除以使文件最小。All JS和All CSS可以帮助你方便地查看文件中的JavaScript文件和CSS文件,Printable View是类似于Word中的打印预览工具
3、使用YSlow来提速
如果你的页面总分低于60或者处于E、F的水平,那么你就有必要对页面进行改进了,不要以为这项工作可以可无,在越来越讲求用户体验的Web2.0时代,如果你能为用户节省1ms的时间或者节省一个HTTP请求都会给你带来潜在用户。
对于小型网站来说如果提供自身性能增加用户体验呢?对于Web Host的主机租用者来说,他们不能直接接触到服务器该做些什么呢?在下面一节的文章,我将以PJBlog架设的博客系统来详细介绍如何提高网站的性能以增加用户体验。
你的网站为什么会慢?——用YSlow为你的网站提速的更多相关文章
- 关于大型网站技术演进的思考(十九)--网站静态化处理—web前端优化—上(11)
网站静态化处理这个系列马上就要结束了,今天我要讲讲本系列最后一个重要的主题web前端优化.在开始谈论本主题之前,我想问大家一个问题,网站静态化处理技术到底是应该归属于web服务端的技术范畴还是应该归属 ...
- 网站实战 从效果图开始CSS+DIV 布局华为网站
经过我们的前面css的学习,我们已经分模块的掌握的CSS的技术,但是,要是完整的做一个页面,我们还没有接触过,这次呢,小强老师来和大家完整的利用CSS+DIV做一个网站案例,我们来模仿下华为的网站. ...
- 【转】关于大型网站技术演进的思考(十九)--网站静态化处理—web前端优化—上(11)
网站静态化处理这个系列马上就要结束了,今天我要讲讲本系列最后一个重要的主题web前端优化.在开始谈论本主题之前,我想问大家一个问题,网站静态化处理技术到底是应该归属于web服务端的技术范畴还是应该归属 ...
- 关于大型网站技术演进的思考(二十一)--网站静态化处理—web前端优化—下【终篇】(13)
本篇继续web前端优化的讨论,开始我先讲个我所知道的一个故事,有家大型的企业顺应时代发展的潮流开始投身于互联网行业了,它们为此专门设立了一个事业部,不过该企业把这个事业部里的人事成本,系统运维成本特别 ...
- 关于大型网站技术演进的思考(二十)--网站静态化处理—web前端优化—中(12)
Web前端很多优化原则都是从如何提升网络通讯效率的角度提出的,但是这些原则使用的时候还是有很多陷阱在里面,如果我们不能深入理解这些优化原则背后所隐藏的技术原理,很有可能掉进这些陷阱里,最终没有达到最佳 ...
- [No00006B]方便的网络下载工具wget 可下载网站目录下的所有文件(可下载整个网站)
wget是linux下命令行的下载工具,功能很强大,它能完成某些下载软件所不能做的,比如如果你想下载一个网页目录下的所有文件,如何做呢?网络用户有时候会遇到需要下载一批文件的情况,有时甚至需要把整个网 ...
- 【PC网站前端架构探讨系列】关于中小型PC网站前端架构方案的讨论与实践
目 录 1.遇到的问题 2.目标 3.探讨 4.架构设想 5.流程 6.初步实现 7.存在问题 8.最后 遇到的问题 我在这个系列上篇文章 已经讲解并开始逐步应用模块化思想,不知大家还记不记得,题 ...
- 网站优化记录-通过命令预编译Asp.net 网站,成功优化到毫秒级别。
在去年一次项目上线时发现部署的站点首次访问跟回收后响应特别慢.(使用的是vs工具预编译的方式发布),在随后找到解决办法是通过命令预编译Asp.net 网站,成功解决站点响应在毫秒级别. 预编译 ASP ...
- 为什么各大网站都纷纷用起了https?哪些网站需要https(SSL证书)
其实最近我也在易维信网站的开发组内讨论应用全站https事宜. 其原因非常简单. 因为不断接到用户投诉说网站上出现影响浏览体验的大面积广告. 可是网站平常只针对未登录用户在顶栏和底栏打两小条广告.而且 ...
随机推荐
- bzoj 3110: [Zjoi2013]K大数查询 树状数组套线段树
3110: [Zjoi2013]K大数查询 Time Limit: 20 Sec Memory Limit: 512 MBSubmit: 1384 Solved: 629[Submit][Stat ...
- BZOJ 1003 物流运输trans
Description 物流公司要把一批货物从码头A运到码头B.由于货物量比较大,需要n天才能运完.货物运输过程中一般要转停好几个码头.物流公司通常会设计一条固定的运输路线,以便对整个运输过程实施严格 ...
- 机械硬盘与SSD固态硬盘性能的深度
从7200转硬盘升级到10000转的迅猛龙,那叫量变.从10000转的迅猛龙升级到SSD,这个叫质变.2者的差距是有些地方相当大,而有些却很接近,主要是难比较. 经常听到有人说:我买2个黑盘组RAID ...
- KMP字符串模式匹配详解(转)
来自CSDN A_B_C_ABC 网友 KMP字符串模式匹配通俗点说就是一种在一个字符串中定位另一个串的高效算法.简单匹配算法的时间复杂度为O(m*n);KMP匹配算法.可以证明它的时间复杂度 ...
- SQL server 变量、运算符
一.三个表的练习 表一:学生表 student学号:code int (主键)从1开始姓名:name varchar(50)性别:sex char(10)班级:banji char(10)语文教师编号 ...
- Git fork指令
ork并且更新一个仓库 现在有这样一种情形:有一个叫做Joe的程序猿写了一个游戏程序,而你可能要去改进它.并且Joe将他的代码放在了GitHub仓库上.下面是你要做的事情: fork并且更新GitH ...
- HDOJ(HDU) 2519 新生晚会(组合公式)
Problem Description 开学了,杭电又迎来了好多新生.ACMer想为新生准备一个节目.来报名要表演节目的人很多,多达N个,但是只需要从这N个人中选M个就够了,一共有多少种选择方法? I ...
- Import larger wordpress xml file
The maximum size is controlled by two PHP settings: upload_max_filesize, and post_max_size. These ar ...
- CentOS 7 更改网卡名到以前的eth0
最近安装了CentOS7,内核总算升级到3.10,支持Linux容器,network namespace······· 但是安装完之后,发现ifconfig没看到熟悉的eth0,却是enp0s3,虽然 ...
- Django-RQ首页、文档和下载 - Django 和 RQ 集成 - 开源中国社区
Django-RQ首页.文档和下载 - Django 和 RQ 集成 - 开源中国社区 Django-RQ 项目实现了 Django 框架和 RQ 消息队列之间的集成.