-Flyぁ梦-

前些日子接触了Google webmasters，看到了page speed，于是下载试用。page speed是Firefox下Firebug的一个附件，依赖于Firebug。很好用，能迅速列出所有影响网页加载速度的原因及优化方法，然后分三部分：红色警告、黄色警告和绿色通过。对于网站管理员来说十分值得一用，大力推荐。

Google page speed的官方网页：http://code.google.com/speed/page-speed/，包括下载和文档。

page speed提出的几个方面的加速方法，主要针对网站的静态资源，如css、js、image和静态html等

• 尽量合并css和js文件

理由很简单，数量少了，http请求就好了，当然就加速了。不过这点基本很难优化，多个js和css往往属于不同的模块，所以一个模块下尽量只有1个css文件和1个js文件吧。page speed给出（红色警告）。

• gzip压缩css、js、image文件

gzip技术可以将css和js文件压缩减少大约60%以上的大小，我的博客首页被提示压缩可节省68%的大小。压缩的副作用是多吃CPU，压缩率越高CPU吃的也越多。要开启gzip压缩，需要在apache、nginx等web服务器上配置，比较有技术性。page speed给出（红色警告）。

• 缓存，Last-Modified、Expires和Etag

浏览器缓存又可以减少大量的http对静态资源的请求，通过设置Last-Modified、Expires和Etag这几个http头属性，可以将基本不会变化的静态资源缓存个把个月。此些设置也要在web服务器上配置，当然如果是Java或Python某些框架可以对静态资源的URL也抓到的可以通过程序来实现，php wordpress的话就不知道了。page speed给出（红色警告）。

• 优化css（黄色警告）

把css放在文档head中；避免@import；选择符层次不要太深，像div table tr td .center{ } 这样。需要较高css技巧恩。page speed给出（黄色警告）。

前面几个优化点基本还是算广为人知的，下面几个优化点我也是第一次知道，很有意思。

• 从一个永不设置cookie的域获取静态资源

查了文档后，大致明白了原因。因为静态资源只有http头，而没有content，所以带cookie插入的域的http包就会比较大，cookie域在http包中的比例一般比较大。还有可能因为cookie的原因导致Last-Modified修改而影响缓存？我猜的…于是Google推荐用2个域名，专用1个域名来获取静态资源，然后把CNAME设置为网站主域名，就像Google的gstatic.com。page speed给出（红色警告）。

• 用css sprites处理静态图片资源

不知道什么是css sprites的参见：http://baike.baidu.com/view/2173476.htm。简单就是将所以零碎的小图片合并成一个大图片，然后用csss属性进行精确定位分割。这样可以大大减少对图片的http请求，不过你的css技术可要过硬哦。page speed给出（红色警告）。

• *可缓存、压缩的资源需要有一个”Vary: Accept-Encoding”

只有大概了解，Google的说法这样静态资源会生成2份，1份压缩后的，1份未压缩的，这样服务器端可以按照客户端的不同要求来选择发送哪一个。page speed给出（黄色警告）。但也在网上有看到如果存在这个属性，cache命中率会降低，不甚理解。打个*号表示此项有争议 = =

看到如此多被page speed警告，大多数还是红色警告，不甚手痒想试着优化，但是由于是虚拟主机的空间没法自己操纵Apache，CPanel貌似也没有提供相关支持，于是更加助长了想要买一个VPS自己搭系统的欲望，但是好贵啊好贵T_T