下午,网站被吐槽了,访问太慢。
最初,我以为是首页的banner图片,太大导致的,之前是500kb的高清图。立即去看了下,banner大图已经压缩到50kb了。
so,不是图片的问题。
用Chrome打开网站,禁用缓存,总体访问情况:
272个请求,2.68MB,耗时5.56s(load:5.03s,DOMContentLoaded:2.45s)
先找出最大的3个文件:
jquery.js 118kb ,服务器本地,而且没有压缩,耗时2.12s
layout.css 55.8kb,服务器本地,而且没有压缩,耗时1.58s
banner.jpg 53.2kb,服务器本地,压缩过的高清图片
还有很多js,都花费了1~2s。
既然访问这么慢,必须去优化喽。
先做2步:
1.jquery.js等公共js文件,用网上免费的cdn。
http://www.bootcdn.cn/ 稳定、快速、免费的开源项目的CDN服务
使用之后,耗时4.57s(load:4.03s,DOMContentLoaded:1.30s)
节省了1s。
cdn版本的jquery大小38kb,加载需要100ms。
2.layout.css等本地js和css资源,压缩部署。
4.25(load:4.03s,DOMContentLoaded:1.30s)
压缩之后,时间并没有减少。
受服务器的带宽和响应速度,影响比较大。
(从网上下载的一个压缩器,下载地址:http://dd2.pc6.com/xc1/JsCssZip.zip)
--------------------------------------------
在尝试了前面2步之后,效果比较明显的是第1步,jquery-cdn。
在Chrome控制台,Network进一步查看,按照Time排序,又发现了一些问题:
1.piwik.js
耗时2.12s
piwik是一个开源的PHP统计工具,最初只使用了百度统计,后来想自己搞一套监测代码。
哎,piwik统计和当前网站放在了同一个服务器的Apache下,带宽也是同一个,影响就比较大了。
2. p2p.jpg
50kb左右的图片,耗时大多在1.7s~1.8s之间。
图片这个问题,真心不是我的错。
官网首页内容比较丰富,图片50kb也不是太大。
解决办法:在不升级带宽的情况下,要么去掉piwik统计,舍不得呀,去掉了怎么看统计数据。用百度统计,数据容易丢失,比如换了账号或者出了点问题。
少用图片或者把图片压缩得更小,不现实呀。
不但不想压缩,还想用不压缩的更清楚的图片哩。
以后还要增加更多的图片,展示内容。
--------------------------------------------
看来,还是需要升级带宽1MB到2MB
2.55(load:2.01s,DOMContentLoaded:630ms)
升级带宽的效果很明显,首页加载时间由4.25s到2.55s。
这也映证了前面的分析,带宽确实是一个瓶颈。
另外,还发现一个问题,服务器不够稳定,应该是Apache的问题,有的时候,“一直等待服务器响应”。
不出意外的话,应该是Apache没有响应,难道是因为工作累了么。
在本地访问的时候,Apache也非常慢,这就不太对劲了。
现在突然怀疑是mysql数据库的问题了。
mysql和服务器上的apache以及本地的Apache都不在同一个机器上,而且自己手动安装的mysql配置也很扎,不太懂mysql的性能优化等配置。难道又要花钱使用云服务器么?
本来想的是,2个小时可以把访问时间由5s压缩到2s的,现在看来是不行了。
吃饱饭,继续优化~