诗沐的设计博客和作品集。提供网页设计/开发/用户体验咨询/wordpress博客主题设计等服务。记录网页设计&开发教程,发布wordpress主题。

endless posts

Home » blog » 教程

04/04/2010 (104 days ago)in教程

版权声明:本文来自于Shimu design,转载请注明作者信息及原文链接。
Trackback: 给网站加速:设置expires header (YSLOW提示)

给博客在Apache环境下设置expires

速度至上

这是google的设计理念之一,我也尝试着以后更多关注性能方面的事情。于是今天下决心整一下静态文件的过期时间。

关于expires的具体信息可以在Yahoo YSLOW的文档中查看。简单地说,它是设置了一个静态文件的过期时间,这样就会避免在以后的访问中避免那些不必要的http请求。这对你有大量静态文件(图片,css,js,flash,html等等)的时候,是很有帮助的。

Caution

如果是在apache环境下安装的wordpress,是会有.htaccess这个文件生成的,而且是隐藏起来的。如果你用FTP发现服务器那边并没有这个文件,需要选择查看隐藏文件仔细检查一下。如果有的话,备份一下,直接在里面修改就可以。如果确实没有,可以用记事本创建一个文本文档,然后存成.htaccess,上传到服务器就可以了。

具体的修改方法

YSLOW里的文档有说明,可以加上具体的到期时间,如:Expires: Thu, 15 Apr 2010 20:00:00 GMT。也可以加上相对时间,如ExpiresDefault “access plus 10 years”。具体的代码如下:

FileETag MTime Size

  
       ExpiresActive on
       ExpiresDefault "access plus 10 year"
   

设置完毕后测试一下,请求数确实少了。It works!

至于如果你是IIS环境的(一般国外hosting服务都是apache,国内有少数几个是IIS),其实也很简单,方法类似。如果你是IIS 6的,那你多半需要联系主机服务提供商来代你做这个事情(你没权限)。如果是IIS 7的话,就方便很多,你可以在web.config’s system.webServer中编辑这样一段代码:

<staticContent>
       <clientCache httpExpires="Sun, 29 Mar 2020 00:00:00 GMT" cacheControlMode="UseExpires" />
</staticContent>

It works too!

更新,最近做了一些优化之后,YSLOW评分已经到了88分,google的Page Speed也是88分。接下去准备把一些css背景图片能合并的合并一下,尤其是icon,速度优化无止境啊!

更新,今天发现一个插件Autoptimize可以自动添加expires header、压缩css,js,html,而不需要手动去操作。它是通过拿到<script>等标签来做的,你甚至可以选择CDN(如果你有的话)。不过这种傻瓜式的插件也有不足,就是你以后要更新主题的时候,还是蛮麻烦的。需要的同学去自行安装吧~

类似的网志,挑你喜欢的看:

12 Responses(+Share your idea)

  • pazz7ven

    04/06/2010, 21:00

    .htaccess添加那个代码 就好了麽 不是很懂 见笑了

  • shimu

    04/06/2010, 21:06

    @pazz7ven – 恩 是的,用rewrite就行了。你要看看是apache环境还是IIS?

    FileETag MTime Size
    <ifmodule mod_expires.c>
      <filesmatch "\.(jpg|gif|png|css|js)$">
           ExpiresActive on
           ExpiresDefault "access plus 10 year"
       </filesmatch>
    
  • pazz7ven

    04/06/2010, 22:32

    @shimu – 是阿帕奇 我应该把你这段复制到什么地方

  • shimu

    04/06/2010, 23:23

    @pazz7ven – 在你的.htaccess里面就可以了啊~

  • pazz7ven

    04/06/2010, 23:26

    @shimu – 好的 我试试

  • shimu

    04/06/2010, 23:34

    @pazz7ven – 恩。有问题的话可以在这里回复,或者邮件至wang@shimuuu.com,我会及时回复的~

  • pazz7ven

    04/08/2010, 12:38

    如何检测它已经工作?

  • pazz7ven

    04/08/2010, 12:39

    @shimu
    你真热心 哈哈 谢谢

  • shimu

    04/08/2010, 17:14

    @pazz7ven – 最土的办法是你可以检测打开自己网站的速度有没有变快~

    如果你有装firebug或ie上的httpwatch,或google的pagespeed,或yahoo的YSLOW的话,都有办法看自己网站上那些静态文件有没有缓存到。

  • pazz7ven

    04/08/2010, 23:44

    @shimu
    恩 我慢慢研究

  • mainone

    06/30/2010, 15:21

    请问文中介绍的在iis7的web.config添加:

    这句代码是什么意思?是不是缓存整个网页?
    如果我想只缓存网站中的.js文件和.css文件以及jpg图片文件的话,该如何修改这句代码?
    我的就是is7环境,谢谢!请帮忙回答。

  • shimu

    06/30/2010, 22:57

    @mainone – 缓存你的静态文件的~就是 css js 和图片

leave a comment

* Required (but your email address will never be published)