Liam
Liam

Reputation: 29754

Expires header and performance

OK, I'm having aplay with expires headers in IIS6 on our development server and I don't really get it!

So if I don't add an expires header to a file I get the following request/response when viewed with firebug:

Accept  */*
Accept-Encoding gzip, deflate
Accept-Language en-gb,en;q=0.5
Cache-Control   no-cache
Connection  keep-alive
Cookie  __utma=222382046.267771103.1330592028.1337002926.1340787333.122; __utmz=222382046.1330592028.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none); __utma=76038230.629470783.1340728034.1340728034.1340786921.2; __utmz=76038230.1340728034.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none); timeOutCookie=Wed%20Jun%2027%202012%2011%3A17%3A22%20GMT+0100%20%28GMT%20Daylight%20Time%29; __utmb=76038230.26.10.1340786921; __utmb=222382046.5.10.1340787333; ASP.NET_SessionId=yhib5kyxf1m5azuhoogrstt5; __utmc=76038230; Travel2=ECC62DC4F9C36A41F3BCF0C54F96D877FEA32D4867DB1A3A97D0C6A3BE79EE98517B9B1A4E24289C863D86A2A4A846EA1FF4BF3822E8B6CBF872E25DD1ADF306F724EE1500AA71E28CFCD02476748163929B73856C505E50D185C05E6322488F
Host    site
Pragma  no-cache
Referer http://site/Agents/Flights/FlightSearch.aspx?

Response:

Accept-Ranges   bytes
Content-Length  17864
Content-Type    application/x-javascript
Date    Wed, 27 Jun 2012 09:21:07 GMT
Etag    "0de7d7f192dcd1:a07d"
Last-Modified   Tue, 08 May 2012 12:53:00 GMT
Server  Microsoft-IIS/6.0
X-Powered-By    ASP.NET

Now if I press f5 now, the system retrieves the file from the client cache, cool!

Now if I add the expires header and press ctrl f5 I get a slightly different request/response:

Accept  */*
Accept-Encoding gzip, deflate
Accept-Language en-gb,en;q=0.5
Cache-Control   no-cache
Connection  keep-alive
Cookie  __utma=222382046.267771103.1330592028.1337002926.1340787333.122; __utmz=222382046.1330592028.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none); __utma=76038230.629470783.1340728034.1340728034.1340786921.2; __utmz=76038230.1340728034.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none); timeOutCookie=Wed%20Jun%2027%202012%2011%3A21%3A11%20GMT+0100%20%28GMT%20Daylight%20Time%29; __utmb=76038230.27.10.1340786921; __utmb=222382046.5.10.1340787333; ASP.NET_SessionId=yhib5kyxf1m5azuhoogrstt5; __utmc=76038230; Travel2=ECC62DC4F9C36A41F3BCF0C54F96D877FEA32D4867DB1A3A97D0C6A3BE79EE98517B9B1A4E24289C863D86A2A4A846EA1FF4BF3822E8B6CBF872E25DD1ADF306F724EE1500AA71E28CFCD02476748163929B73856C505E50D185C05E6322488F
Host    site
Pragma  no-cache
Referer http://site/Agents/Flights/FlightSearch.aspx?
User-Agent  Mozilla/5.0 (Windows NT 6.1; WOW64; rv:13.0) Gecko/20100101 Firefox/13.0.1

Response:

Accept-Ranges   bytes
Cache-Control   max-age=86400
Content-Length  17864
Content-Type    application/x-javascript
Date    Wed, 27 Jun 2012 09:24:41 GMT
Etag    "0de7d7f192dcd1:a082"
Last-Modified   Tue, 08 May 2012 12:53:00 GMT
Server  Microsoft-IIS/6.0
X-Powered-By    ASP.NET

Brilliant I've now got a max age in the cache control. Now what's confusing me is this as far as I can tell has now practical difference in how the site performs in terms of downloads. If I press f5 it gets it from the cache, if I press control f5 it gets it from the server with a HTTP 200.

So how does this improve performance? How do you get a HTTP 304 instead of a http 200? I just don't get what this practically archives?

any help would be good thanks

Upvotes: 0

Views: 458

Answers (2)

Ian Oxley
Ian Oxley

Reputation: 11056

The performance improvements come from making fewer HTTP requests. When a browser is parsing a page and sees it has to request a CSS file, if it's already got a copy of it in it's cache with a max-age=31536000, it knows it's cached copy of the file is good for 1 year and doesn't have to make the HTTP request to fetch the file.

Less round trips to the server should result in a faster loading page, and a better experience for users.

Upvotes: 0

Vasiliy Faronov
Vasiliy Faronov

Reputation: 12310

When you set Expires or max-age explicitly, you are telling the client that it will be safe to cache the response for that much time. The client will happily get it from cache, it will not touch your server, there will be no 304. Unless you do Ctrl+F5, which forces the browser to do a full request anew, resulting in 200.

Now what if you don’t set Expires nor max-age? This just means that the client will pick an expiration time by itself, heuristically. Your response is still cached, only the browser has to guess for how long.

So, Expires/max-age are useful in two cases.

  • If you want to recommend caching for a specific period of time—longer than a browser would guess. This is often done with versioned static content, which never changes, so expiration time is set on the order of years.
  • If you want to prevent caching, in which case you set Cache-Control: no-cache and Expires in the past (some versions of IE will ignore no-cache).

Conditional requests, 304 and all that, only come to play after the content has already expired. To revalidate it, the client might do a conditional GET, which, depending on your server setup, may or may not result in 304.

Upvotes: 1

Related Questions