加快网站访问速度——Yslow极限优化
为什么80%的码农都做不了架构师?>>>
Yslow是一套雅虎的网页评分系统,详细的列出了各项影响网页载入速度的参数,这里不做多说。
我之前就一直参考Yslow做博客优化,经过长时间的学习也算是有所收获,小博的YslowV2分数达到了94分(偶耶!),如果换用博客类小网站评分标准更是可以达到满分。
下面我就总结几点大家力所能及优化方法,分享给各位。
下面贴一下小博全新刷新的载入图,下面文章中用得到:
我认为网页优化主要分为两类,个人称之为软优化与硬优化。软优化主要包括:服务器缓存类与浏览器本地缓存类,这些优化主要是参数设置上的改动。而硬优化包括:传输线路,CDN,HTTP请求数,带宽等基础项目。
咱们小博客主要能做的,也是我想介绍的主要是软优化类。
一、Make fewer HTTP requests(减少http请求数)
网页载入中,每一个文件都是一个http请求,包括html,js,css,图片等。而每一个文件的载入都需要DNS查询(可忽略),建立连接,发送请求(可忽略),等待回复,下载文件,总共5个步骤,文件依次载入,时间就得依次增加,文件越多,时间越长。
下面看看俺的主机商小张童鞋的博客载入图吧:
简直是一条长龙,橙色JS,蓝色HTML,绿色CSS,紫色IMG,虽然1秒多就响应,但最终载入时间为9秒。
而面对这样的网页,我们要做的是:
把CSS全都合到一个文件中去(复制粘贴就行)
把JS全都合到一个文件中去(复制粘贴就行)
主题中尽量少的使用图片
如果必须使用图片,把背景图片全都合到一个文件中去(这个用photoshop合成,调用背景图片时用background:url(all.png) no-repeat 几px 几px;来控制背景位置)
把框架网页能去掉的都去了,每一个框架网页等于新打开一个网页。
优化好之后,整个页面只有1个js,1个css,1个背景图片和若干文章图片页面载入速度起码提升2/3。
二、Add Expires headers(添加周期头)
啥叫周期头啊,其实就是给文件一个保质期。
没过期的直接从本地调用,过期了后就得换新的了。
这个做起来简单,直接在网站根目录的.htaccess文件末尾添加以下代码就行了(只有LINUX主机有.htaccess)
其中Axxxxxx是时间,单位秒。
<IfModule mod_expires.c>
ExpiresActive On ExpiresDefault A3600 ExpiresByType image/gif A2592000 ExpiresByType image/png A2592000 ExpiresByType image/jpeg A2592000 ExpiresByType text/plain A604800 ExpiresByType application/x-shockwave-flash A2592000 ExpiresByType video/x-flv A2592000 ExpiresByType application/pdf A2592000 ExpiresByType text/html A600 ExpiresByType image/x-icon A2592000 ExpiresByType application/javascript A604800 ExpiresByType text/css A604800
</IfModule>
这样设置后,第二次访问就会直接调用本地缓存,仅仅HTML重新下载,速度飞快,如图:
三、Configure entity tags (ETags)(配置实体标签设置ETAG)
说实在的我也不知道ETAG是个什么东东,网上的解释说他相当于一个标签,来确认浏览器缓存里的元素是否和原来服务器上的一致,可是却没有说如何设置。终于找到了一篇如何设置的文章,可作者也是不太懂,作者就是万戈大侠了。
他的方法是,在.htaccess中加入这句话。
FileETag none
说实话我并没有明白为什么要设置成none,不过它起作用了,Yslow这项的评分到了A,肯定是有好处的,这就足够了。
四、优化外部调用顺序。(个人想法,也许有错)
这一点是最容易被忽略的。
据我观察,网页载入的时候所有元素不是同时一起载入的,但也不是one by one这么着载入的,它有一个少数连接并发下载的情况,观察文章头部小博的载入图,第1-3个图片就是并发的。所以调用顺序决定了载入顺序,载入顺序决定谁和谁并发。
我做过实验,如果JS文件放在<head></head>中,他会跟随HTML与CSS一同加载,然后等JS加载完成后才加载所有图片,如果JS太肥了的话,这样效率很低,JS要是卡住了,网页更是死活不出来。如图:
那么把JS放在body的footer中,情况就会改善很多,JS跟随大批图片一起载入,共用时间,如文章头部小博载入图。
而且最重要的是,html载入完毕就可以显示DOM元素了,不需要等待JS完毕再显示。
五、服务器缓存
老话题了,WP一般使用插件缓存,我使用的是WP-CACHE,它可以使平时需要1秒左右载入的HTML在几十毫秒内载入。
配合图片本地缓存,二次打开的页面基本是秒开。如图(这就是小博的平时载入速度了):
六、其他
其他就剩下一些零碎的优化了,这些影响比较小。
比如把主题中所有不经常更改内容的php语句直接改成文字,比如博客名神马的。
还有,CSS,JS压缩,小一点就快一点。
本地DNS的选择(在网卡属性里),第一次访问时,DNS-LOOK-UP(DNS查询)也是占了相当时间的,如果你的DNS的ping较高。
COOKIE-FREE 域名设置:意思就是每次建立连接的时候,客户端都要先发一份COOKIE到服务器去,而设置COOKIE-FREE后就可以省下这点时间了。个人觉得没多少时间,不发COOKIE后,用户评论信息还要自己写,体验不好,不建议设置。
就先写这么多,剩下的想到了再补。转载请注明出处。
我了个槽哦,发完文章后又测了一遍YSLOW,变100分了,上一回得100还是小学二年级的事儿呢。
作者:老柴
原文地址:http://laochai.net/491
转载于:https://my.oschina.net/seava/blog/224959
加快网站访问速度——Yslow极限优化相关推荐
- 【转】加快网站访问速度——Yslow极限优化
Yslow是一套雅虎的网页评分系统,详细的列出了各项影响网页载入速度的参数,这里不做多说. 我之前就一直参考Yslow做博客优化,经过长时间的学习也算是有所收获,小博的YslowV2分数达到了94分( ...
- [技术博客]使用CDN加快网站访问速度
[技术博客]使用CDN加快网站访问速度 2s : most users are willing to wait 10s : the limit for keeping the user's atten ...
- squid正反向代理-加快网站访问速度
配置squid代理服务器加快网站访问速度 一:squid服务概述 Squid cache(简称为Squid)是一个流行的自由软件(GNU通用公共许可证)的代理服务器和Web缓存服务器.Squid有 ...
- 加快网站访问速度--jquery.js
jquery现在是越来越大,网络加载速度上我们应该做到能省就省,毫无疑问google的服务器和cdn以及访问速度是非常快的,而且google敞开怀抱,提供各种代码库给我们下载调用.jquery就是其中 ...
- 使用hosts加快网站访问速度
文章目录 前言 第一步:找到对应的 IP 第二步:修改 hosts 第三步:刷新 dns 缓存 github 的问题 前言 我们在浏览网页时候,有时候会发现网站响应速度比较慢,我们可以考虑利用 hos ...
- 提升网站访问速度--Yslow优化
Yslow是一套雅虎的网页评分系统,详细的列出了各项影响网页载入速度的参数,这里不做多说. 下面我就总结几点大家力所能及优化方法,分享给各位. 下面贴一下小博全新刷新的载入图,下面文章中用得到: 我认 ...
- 浅谈网站访问速度优化
周末女朋友公司的智慧医保项目上线了,但是web端访问速度比较慢,然后就来问问我有没有好的优化方案.于是就这篇[浅谈网站访问速度优化]就诞生了. 1.备案:好多个人网站为了方便,往往不喜欢备案,就把网站 ...
- 加快使用Google的CDN网站访问速度
由于众所周知的原因,只需替换一个域名就可以继续使用Google提供的前端公共库了. 同样,通过script标记引用这些资源,让网站访问速度瞬间提速吧骚年! 很多网站,尤其是国外网站,为了加快网站的速度 ...
- 测试网站访问速度的5个方法
网页载入速度对于一个网站来讲很关键,Google已经将一个网站的载入速度列入了网站关键字排名的考虑因素当中,也就是说如果你的网站有足够的内容,而且载入速度比别人的网站更快一步的话,那么你就是获得更好的 ...
最新文章
- jquery仿邮箱文本输入框自动加载邮箱后缀
- 括号(打印n对括号)
- 动态SQL应用(成绩排名)
- Android--SlidingDrawer的使用介绍
- 种群计数 (pop_count)
- python输出汉字怎么注释中文_Python使用中文注释和输出中文(原创)
- 5920. 分配给商店的最多商品的最小值
- Android TabHost中实现标签的滚动以及一些TabHost开发的奇怪问题
- CUDA中的一些基本概念
- Soul递交IPO招股书:腾讯为第一大股东,依然处于亏损状态
- 刘强东成京东数科二股东;高通再诉苹果;金立否认裁定破产 | 极客头条
- Unity——JSON
- html日期选择器小日历样式,9 款样式华丽的 jQuery 日期选择和日历控件
- 脑电分析系列[MNE-Python-7]| Python读取.edf文件
- 【中土世界】宏大地名汇总
- java 自幂数_java计算自幂数和水仙花数
- 2021上海高考成绩几点查询,2021年上海高考分数公布时间几点,具体时间什么时候可以查询...
- 计算机组装大赛策划书新闻稿,关于装机大赛策划书
- textastic使用教程|4个实用功能让你出色的完成代码编辑
- 200行Perl 语言实现 VCD 转ATE测试pattern ---VCD的解析