Live data from Hacker News

How To Optimize Your Site With HTTP Caching

betterexplained.com

21–30 of 30 posts

Re: How To Optimize Your Site With HTTP Caching

#22
post #18

This is a good writeup, though I'm surprised no-one has mentioned the holy grail of caching with HTTP. That of course is good old RFC 2616: http://www.ietf.org/rfc/rfc2616.txt There's an entire section in there devoted just to caching in HTTP. Very well worth reading in its entirety.

http://tools.ietf.org/html/rfc2616 adds errata, RFCs that update it and hyperlinks (it is a web after all)

Direct link to Caching in HTTP http://tools.ietf.org/html/rfc2616#section-13

Re: How To Optimize Your Site With HTTP Caching

#23

Earlier quoted context omitted.

One thing I don't understand. If the server has asked the client to cache an image for a year, and the image is indeed updated in that time, is there some way of telling the client to download that image anyway? I'd take it to Google, but I have no idea how I'd ask that in Google query form.

This is actually referenced in the article. You can use the Last-Modified date and the server will either return a 304 (Not Modified) or the modified image if it is newer.

I read that, but if you say "this image won't change for exactly one year" and the client doesn't even request that resource from the server any more, how do you start that dialogue again?

pork has offered that you add a junk parameter to the end of a GET request and that should disrupt the cache, I'll need to read in to this. I'm interested in optimizing web speed as much as possible and this sort of thing and caching has always been something I've understood poorly.

Re: How To Optimize Your Site With HTTP Caching

#24
post #9

Earlier quoted context omitted.

One thing I don't understand. If the server has asked the client to cache an image for a year, and the image is indeed updated in that time, is there some way of telling the client to download that image anyway? I'd take it to Google, but I have no idea how I'd ask that in Google query form.

In HTTP, since it's stateless, you don't "tell" the client anything without it first asking. The usual way to bust the cache is to add a junk parameter to the end of a GET request.

I see. I assume you would change the html code to say or something like that to force the browser to redownload it? What if the html page itself were cached for a year? Is there an Apache setting that can give a global "no caching" command, or something like that?

Re: How To Optimize Your Site With HTTP Caching

#25
post #9

Earlier quoted context omitted.

In HTTP, since it's stateless, you don't "tell" the client anything without it first asking. The usual way to bust the cache is to add a junk parameter to the end of a GET request.

I see. I assume you would change the html code to say or something like that to force the browser to redownload it? What if the html page itself were cached for a year? Is there an Apache setting that can give a global "no caching" command, or something like that?

Yep, exactly -- not only can the images be cached, but the HTML too!

The ideal way to do it is have the "loader file" (index.html) only cached with last-modified date, so as soon as it changes the client is aware. The client requests the file each time, and is returned the full file or a simple Not Modified response.

Within the file, you have references to permanently-cached, versioned resources (). If the cache expiration is far enough away, the browser won't even issue the request to check for a new version.

Some browsers don't cache query params so you might use rewriting rules to change foo.png to foo.123.png. This rewriting is done automatically for you with Google Page Speed module for Apache.

Re: How To Optimize Your Site With HTTP Caching

#26
post #16
post #6

Earlier quoted context omitted.

Thanks for the kind words (I'm the author). My main, ever-evolving goal when writing tutorials is to try to write what I'd like to see: 1) Explain the underlying concept 2) Show variations 3) Explain how to do it yourself 4) Show how to verify you did it correctly 5) Meta: be as concise as possible, maximize bang for the buck

I've always enjoyed your writings kalid. I esp liked http://betterexplained.com/articles/a-visual-intuitive-guide... . Thanks so much for your site!

Thanks, I appreciate it!

Re: How To Optimize Your Site With HTTP Caching

#27
post #25

Earlier quoted context omitted.

I see. I assume you would change the html code to say or something like that to force the browser to redownload it? What if the html page itself were cached for a year? Is there an Apache setting that can give a global "no caching" command, or something like that?

Yep, exactly -- not only can the images be cached, but the HTML too! The ideal way to do it is have the "loader file" (index.html) only cached with last-modified date, so as soon as it changes the client is aware. The client requests the file each time, and is returned the full file or a simple Not Modified response. Within the file, you have references to permanently-cached, versioned resources ( ). If the cache exp…

It sounds like a much deeper subject than I first appreciated. I'll definitely read up on this. Using URL rewriting with caching is interesting, I've not seen that before.

I work with one lady that complains about a slow loading JQuery slideshow, and smarter caching may very well be the solution (at least, after the first load).

Re: How To Optimize Your Site With HTTP Caching

#28

Earlier quoted context omitted.

This is actually referenced in the article. You can use the Last-Modified date and the server will either return a 304 (Not Modified) or the modified image if it is newer.

I read that, but if you say "this image won't change for exactly one year" and the client doesn't even request that resource from the server any more, how do you start that dialogue again? pork has offered that you add a junk parameter to the end of a GET request and that should disrupt the cache, I'll need to read in to this. I'm interested in optimizing web speed as much as possible and this sort of thing and cachi…

Yep, that's the problem with long expiration dates -- the client may never check again (that's what we wanted, right?). The workaround is to request a new url which restarts the process.

Separately, the easiest way to get started with all these optimizations is to run the page speed check online:

https://developers.google.com/pagespeed/

and follow the recommendations, most important to least.

Re: How To Optimize Your Site With HTTP Caching

#29
post #25

Earlier quoted context omitted.

Yep, exactly -- not only can the images be cached, but the HTML too! The ideal way to do it is have the "loader file" (index.html) only cached with last-modified date, so as soon as it changes the client is aware. The client requests the file each time, and is returned the full file or a simple Not Modified response. Within the file, you have references to permanently-cached, versioned resources ( ). If the cache exp…

It sounds like a much deeper subject than I first appreciated. I'll definitely read up on this. Using URL rewriting with caching is interesting, I've not seen that before. I work with one lady that complains about a slow loading JQuery slideshow, and smarter caching may very well be the solution (at least, after the first load).

I've experimented and managed to shave 2 seconds off a client's website upon reloads - that's significant! Still playing with it, but I've already learned a lot.

Re: How To Optimize Your Site With HTTP Caching

#30
post #28

Earlier quoted context omitted.

I read that, but if you say "this image won't change for exactly one year" and the client doesn't even request that resource from the server any more, how do you start that dialogue again? pork has offered that you add a junk parameter to the end of a GET request and that should disrupt the cache, I'll need to read in to this. I'm interested in optimizing web speed as much as possible and this sort of thing and cachi…

Yep, that's the problem with long expiration dates -- the client may never check again (that's what we wanted, right?). The workaround is to request a new url which restarts the process. Separately, the easiest way to get started with all these optimizations is to run the page speed check online: https://developers.google.com/pagespeed/ and follow the recommendations, most important to least.

I've actually been playing around with this stuff all day, pretty much since my last comment above. I've enabled smarter caching on my website, replaced multiple image requests with a single spritesheet, optimized my images, and cleaned up my CSS file to remove unused code. Google's PageSpeed has been an invaluable tool, as well as webpagetest.org which breaks down the data in an intelligent way.

Turns out Google Analytics is actually doubling my page load time, but the data is too valuable to give up.

Anyway, thanks for the tips.

Post reply on HN