2

I am having a little trouble with sorting out my HTTP headers for my sites. I am currently setting up Varnish on my server and so trying to get everything working correctly.

All my sites are WordPress except for one which is Joomla if this makes any difference.

The query I have is that I am trying to sort out browser caching with HTTP headers. Some of the sites are fairly large and I think it would help to cache as much as I can. I can do this with max-age however, I am having issues with getting the browser to refresh the content after it has changed, whether this is the actual HTML or CSS.

Here are my response headers of the HTML:

Accept-Ranges: bytes
Age: 2
Cache-Control: max-age=3, must-revalidate
Connection: keep-alive
Content-Encoding: gzip
Content-Length: 6451
Content-Type: text/html; charset=UTF-8
Date: Tue, 02 Feb 2016 19:48:29 GMT
Expires: Tue, 02 Feb 2016 19:48:29 GMT
Last-Modified: Tue, 02 Feb 2016 19:48:13 GMT
Server: Apache
Vary: Accept-Encoding,Cookie
Via: 1.1 varnish
X-Cache: HIT
X-Varnish: 1571572700 1571572688

Obviously at the moment, I have a max-age of 3 which isn't ideal as after 3 seconds, Varnish records a miss.

Here is the response header for the CSS file

Accept-Ranges: bytes
Age: 77
Cache-Control: max-age=604800
Connection: keep-alive
Content-Encoding: gzip
Content-Length: 30070
Content-Type: text/css
Date: Tue, 02 Feb 2016 19:49:30 GMT
Expires: Thu, 03 Mar 2016 19:48:13 GMT
Last-Modified: Fri, 29 Jan 2016 12:59:15 GMT
Server: Apache
Vary: Accept-Encoding,User-Agent
Via: 1.1 varnish
X-Cache: HIT
X-Varnish: 1571572717 1571572659

It does work as it's hitting Varnish, but if I change the stylesheet then it won't refresh for 7 days which is annoying if I need to make a quick change to something.

This same rule applies if the max-age for the html isn't 3 but something better like 1 day.

Is there a way to have a long max-age for the above, but if the CSS file or HTML on the WordPress pages has been changed, then it'll show this instead of the stale files.

I have been trying for most of the day to sort this out and whilst it may seem like a simple tweak to the .htaccess file, I can not seem to get it to work properly.

Any advise or pointers would be greatly appreciated.

Thanks

Improve this question

1 Answer 1

Reset to default
1

For the HTML files, you can't have it both ways. The only way for Varnish to always show HTML files if they've changed would be to check every time (=cache miss), at which point you've not gained anything by using it. If your site changes very frequently, setting a short cache time like you have is probably the best you can do (although 3 seconds might be a bit too short). Personally I don't usually bother caching HTML files except on high traffic sites.

For static assets like stylesheets, ideally you want the URL to change when the file does. The simplest way to do this is to include the last modified timestamp in the URL for the stylesheet. I don't use Wordpress, but I'd be surprised if plugins don't exist that will automate this for you. Then you can set very high max-age values and the content will always be fresh.

Also, don't use both max-age and expires headers - stick to one or the other.

Improve this answer
7
  • I understand that having a low max-age time is pointless with using Varnish. About half the sites have fairly low traffic, only a few thousand hits a day so Varnish may even be a bit overkill but every little helps! Which one would be better? WordPress (that I know of) doesn't have the ability to change URLs like that but I get what you are saying. I have never had this issue before, something happened with the server and I have had to rebuild everything.
    – WPDEVE
    Feb 2, 2016 at 20:08
  • You can still gain benefit from just caching the static files (including images). Varnish will serve these much faster than something like Apache would out of the box.
    – Tim Fountain
    Feb 2, 2016 at 20:10
  • I'd like to cache static files but I'd rather not have to wait for it to refresh if there is a long cache time. Is there really no way to set the last modified time, but have a max-age so even if the max-age is 1 day for example, if I change it half way through the day, that max-age will reset, serving the new content?
    – WPDEVE
    Feb 2, 2016 at 20:13
  • You can issue PURGE commands to Varnish to remove specific URLs,, so you might be able to find a way to automate this for changes (e.g. wordpress.org/plugins/varnish-http-purge), but like I said, I don't use Wordpress so I can't vouch for specific plugins.
    – Tim Fountain
    Feb 2, 2016 at 20:16
  • I do use that plugin and so that shouldn't be an issue. Despite purging the cache, even with the plugin or via SSH the old content is still being served. The only way at the moment that I can get the up to date content to be served is to use no-cache or max-age=0 or something small like that which of course doesn't help at all. I am not entirely sure whether this is a WordPress specific issue which is why I thought to post it here as it's more about the header site of things (I think).
    – WPDEVE
    Feb 2, 2016 at 20:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.