站点优化的好处是非常多的,从大方面来说主要有以下几点:
1. 页面加载速度成倍的提升
根据站点原始状态和优化程度的不同,提升的效果也不一样。一般来说可以提升3~5倍。
2. 降低站点流量
对于流量受限制的空间来说也就相当于节省了银子。
3. 降低服务器负载
流量节省的同时,也降低了服务器的负荷,对于CPU使用率受限、并发数不限的空间来说,也就意味着提升了最大并发数。
既然好处有这么多,那当然是要对站点做优化了,下面具体说一下如何优化站点:
1. 诊断分析
在优化站点之前,先使用站点在线分析工具进行分析。
目前可以在线分析站点的网站有很多,不过最为推荐的是GTmetrix(http://gtmetrix.com),
这个网站可以对站点进行全方位的检查并给出优化建议及当前评级,并且还提供了非常全面的检测报告PDF格式下载功能。
除了GTmetrix,百度也提供了网站速度诊断工具,前提是要安装百度统计(http://tongji.baidu.com)之后才能使用。
建议最好是结合这两个分析工具对站点进行分析检查,对站点的大致情况有一个认识,了解亟待解决的一些问题。
2. 页面静态化
什么是页面静态化就不多介绍了,搜一下就有很多全面的介绍。
WP静态化的工具就是用cos-html-cache,具体的安装及用法参见:安装WP后几款必装插件。
3. 压缩javascript、css
这里的压缩不是指使用压缩算法对源文件进行压缩编码,而是去掉文件中的空格换行注释等一些无用字符,通俗的说,就是把文件压压紧。
压缩javascript的工具可以用jsmin,用法是在命令行中输入命令 jsmin.exe newFile.js
originalFile.js要与jsmin在同一目录下。
也可以用站长工具提供的在线压缩工具: http://tool.chinaz.com/Tools/JsFormat.aspx
但是对于一些较大的js文件还是用jsmin进行压缩比较好。
css的话就用站长工具提供的css在线压缩工具就可以了: http://tool.chinaz.com/Tools/CssFormat.aspx
4. 合并javascript、css
WP在安装一些主题或者插件之后,head中应用的js和css会越来越多。
在加载页面时,每一次应用都是一次http访问,那么减少js/css的引用次数,当然也就加快了加载速度。
所以可以把多个js/css合并到一个引用文件中,再将被合并掉的js/css引用去掉。
这一步优化操作是比较繁琐且风险较高的,会涉及到修改代码文件,而且有些js/css还会调用其它资源文件导致合并之后资源调用出现问题。
所以不推荐WP初学者进行这步操作,除非对修改比较有把握。
5. 开启GZIP压缩
这里的压缩是指使用压缩算法对文件进行压缩编码。所有的静态资源,比如文本,图片,音频,视频等都是可压缩的,只是压缩比率不同。
那网页本身就是一个文本,只是格式是html的,js、css也都是文本,只是格式不同。
通过压缩算法,可以大大减小文本文件的体积,从而使加载文本的速度成倍的加快。
对于站点来说,目前比较通用的压缩方法是启用gzip压缩。它会把浏览器请求的页面,以及页面中引用的静态资源以压缩包的形式发送到客户端,
然后在客户端完成解压和拼装。具体是实现不用关心,我们只要将GZip启用就好。
首先查看站点是否已经启用了gzip,可以使用站长工具提供的gzip检查工具: http://tool.chinaz.com/Gzips/
如已经开启了的话,那么就不用再单独开启;否则可以在.htaccess文件中加入两行:
php_flag zlib.output_compression On php_value zlib.output_compression_level 5
但是仅仅加这两行是没用的,它是只是开启了压缩模块,如果在gzip检测网站再检测一次,仍旧显示是未开启。
因为还没有指定对哪些类型的静态资源进行压缩。那么再继续往.htaccess中加入几行:
<IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteCond %{REQUEST_FILENAME} -f RewriteRule ^(.*)(js|css|html|htm)$ /gzip.php?file=$1$2&type=$2 [L] </IfModule>
上面指定了对js,css,html,htm几种后缀名格式的文件调用gzip.php文件进行处理,所以还要再创建一个gzip.php,并放到.htaccess相同目录下:
<?php $file=$_GET['file']; switch ($_GET['type']){ case 'css': header("Content-type: text/css"); break; case 'js' : header("Content-type: text/javascript"); break; case 'html': header("Content-type: text/html"); break; } include($file); ?>
再进行一次gzip检测,可以在百度的检测工具里测试,如果一切正常的话,那么已经看不到gzip未开启这一项了。
而且在站长工具的gzip检测里,也会显示gzip开启的状态。
6. 设置客户端缓存
页面中的静态资源一旦引用,就会保存在客户端的临时文件夹里。
如果服务端设置了静态资源过期期限,那么在过期之前,只要客户端再次访问页面,就会直接从临时文件夹中拿去静态文件而不用才向服务端请求。
所以在设置客户缓存之后,只要访问过一次页面,在过期期限内再次访问页面的速度将会大大提高。
设置的方法也比较简单,只要在.htaccess中加入几行:
# Expire images header ExpiresActive On ExpiresDefault A0 ExpiresByType image/gif A2592000 ExpiresByType image/png A2592000 ExpiresByType image/jpg A2592000 ExpiresByType image/jpeg A2592000 ExpiresByType image/ico A2592000 ExpiresByType text/css A2592000 ExpiresByType text/javascript A2592000
2592000代表一个月的意思,2592000 = 60*60*24*30
7. 合并域名
所谓合并域名,就是指如果有引用其它域名站点下的资源的话,把资源挪到自己的站点下,并修改资源引用地址。
这样可以使访问请求只在少量的域名站点下进行,减少DNS寻址时间。
打个通俗一点的比方就是,从一个仓库拿东西,比从不同的仓库分别拿东西要快。
从优化操作的角度上来说,就是把引用其它站点的文本、图片挪到自己的站点下,从自己的站点引用。
8. 挪动JS位置
在页面请求中,javascript是在加载之后才可以加载后面的内容,而css是可以并行加载的。
所以最好降js的引用都放置在页面的尾部,也就是之前。
到这里主要的站点优化操作就完成了,相信在完成了这一系列的优化之后,WP站点的访问速度已经有了大幅提升了。
其它
除此之外,还可以使用一个非常好的优化插件Autoptimize,它可以自动合并、压缩页面中所有的js/css,并将引用后移。属于高性能傻瓜型优化插件,使用Autoptimize的话,第2,4,8步都可以跳过了,既省事又避免了修改错误的风险而且效果也不错。
但是Autoptimize对js/css的合并是以php格式为基础进行压缩,所以还要对Autoptimize生成的.php进行客户端缓存。
在.htaccess中条件以下代码
<IfModule mod_headers.c> <FilesMatch ".(php)$"> Header set Last-Modified "Oct, 31 Aug 2011 00:00:00 GMT" </FilesMatch> </IfModule>
Last-Modified的时间可以任意指定,但是一定要在当前时间之前。
当然还可以继续做一些很多事情来提升站点速度,比如使用简洁的模板,减少首页图片数量,减少页面js代码等。
不管是进行美观的页面布局,还是进行站点优化,最终的目标是提升用户体验。
不过请相信一个永恒不变、放置四海皆准的真理 ---- Simple is beautiful!