使用.htaccess提高YSlow成绩

This post was authored by Eric Wendelin. To learn more about Eric, click here.

该帖子由Eric Wendelin撰写。 要了解有关Eric的更多信息, 请单击此处

A significant part of your YSlow grade depends on how well your site utilizes optimal caching techniques. By editing your .htaccess file, you can increase your YSlow score by 20 points or so in just 3 minutes!

YSlow成绩的很大一部分取决于您的站点利用最佳缓存技术的程度。 通过编辑.htaccess文件,您可以在3分钟内将YSlow得分提高20分左右!

缓存快速入门 (Quick Intro to Caching)

Caching is a browser feature that allows storage of certain types of web files on the client-side. In most cases, we want to have our clients cache our static files like HTML and CSS so that our website is faster after the first request.

缓存是一种浏览器功能,允许在客户端存储某些类型的Web文件。 在大多数情况下,我们希望让客户缓存我们的静态文件(例如HTML和CSS),以便在第一个请求之后我们的网站更快

Browser caching mainly depends on two things: the headers you send in an HTTP response and the browser your client is using.

浏览器缓存主要取决于两件事:HTTP响应中发送的标头和客户端使用的浏览器。

304 Means wasted time

There are a couple of things a browser can do when caching depending on the headers used.

取决于所使用的标头,浏览器在缓存时可以做几件事。

  1. It can check back on every request, and servers will reply with a HTTP status 304 (Not Modified) if the file is indeed the same.

    它可以检查每个请求 ,如果文件确实相同,服务器将以HTTP状态304(未修改)答复。

  2. Only ask the server for the file when the cached one has expired.

    仅当缓存的文件过期时才向服务器询问文件。

The latter case is better for performance because the browser doesn't even ask and therefore saves a lot of HTTP requests.

后一种情况对性能更好,因为浏览器甚至不询问 ,因此节省了大量HTTP请求。

设置过期标题 (Setting the Expires Header)

One of the best things we can do to ensure good cache-ability is set a far future Expires header:

为了确保良好的缓存能力,我们可以做的最好的事情之一就是设置一个将来的Expires标头


<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)(\.gz)?$">
Header set Expires "Thu, 15 Apr 2012 20:00:00 GMT"
</FilesMatch>


Note here that if your site changes a lot, you'll need to rename/version your files or get clever with your ETags to keep users up-to-date. If you Firebug my site, eriwen.com, you'll see that I do just that. Stay tuned there for a script that can help you automate this.

请注意,如果您的网站发生了很大变化,则需要重命名/版本化文件或巧妙使用ETag,以使用户保持最新状态。 如果您用萤火虫浏览我的网站eriwen.com ,您会发现我只是这样做。 请继续关注那里的脚本,该脚本可以帮助您自动化。

控制这些ETag (Controlling Those ETags)

ETags are difficult because they take precedence for caching in most browsers. You can change all the headers you want, but if the ETag associated with a file is always the same, caching will never work how you expect. In most situations, you should turn your ETag headers off.

ETag很困难,因为它们在大多数浏览器中都优先缓存 。 您可以更改所需的所有标头,但是如果与文件关联的ETag始终相同,则缓存将永远无法满足您的期望。 在大多数情况下, 您应该关闭ETag标头


<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)(\.gz)?$">
Header unset ETag
FileETag None
</FilesMatch>


Yes, you can combine the two snippets:

是的,您可以结合使用以下两个片段:


<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)(\.gz)?$">
Header set Expires "Thu, 15 Apr 2012 20:00:00 GMT"
Header unset ETag
FileETag None
</FilesMatch>


测试新设置 (Testing Your New Settings)

The best way to see what's going on is to check the "Net" tab in Firebug. You can use a tool like the Live HTTP Headers Firefox extension (there's also one for IE) to verify what headers are being sent. NOTE: If you refresh the page instead of clicking a link, Firefox will recheck all files it has cached. This is not the test you're looking for.

查看最新情况的最好方法是检查Firebug中的“ Net”选项卡。 您可以使用诸如Live HTTP Headers Firefox扩展之类的工具(对于IE也有一个)来验证正在发送的标头。 注意:如果刷新页面而不是单击链接,则Firefox将重新检查其缓存的所有文件。 这不是您要寻找的测试。

You want to make sure everything is occurring exactly as you intended. Now is the time to bring out your inner control-freak.

您想确保一切都按预期进行。 现在是展现内部控制缺陷的时候了。

结论 (Conclusion)

These are just 2 simple ways to maximize caching (and therefore speed) of your site. There are lots of other headers to play with, but I find that these two give the biggest bang for your buck. Share your caching tricks in the comments!

这只是两种最大化站点缓存(并因此提高速度)的简单方法。 还有很多其他标头可以使用,但是我发现这两个标头可以为您带来最大的收益。 在评论中分享您的缓存技巧!

关于埃里克·温德林 (About Eric Wendelin)

Eric Wendelin is a software engineer for Sun Microsystems. When he’s not doing super-secret programming for Sun, he plays indoor soccer, playing Wii with his friends, and cheering on the Colorado Avalanche. He also writes a blog on JavaScript, CSS, Java, and Productivity at eriwen.com

Eric Wendelin是Sun Microsystems的软件工程师。 当他不为Sun做超级秘密编程时,他会踢室内足球,和他的朋友一起玩Wii,并为科罗拉多雪崩队加油。 他还在eriwen.com上撰写了有关JavaScript,CSS,Java和Productivity的博客。

翻译自: https://davidwalsh.name/yslow-htaccess

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值