expires headers and forcing cache-loading instead of 304?

Question

So here is a little mystery. Google Analytics javascript somehow always loads from browser cache on F5 (in Firefox). I can not get the same thing to happen with my own scripts.

Here are the headers that come back on initial request:

For http://google-analytics.com/ga.js:

(Status-Line)           HTTP/1.1 200 OK
Last-Modified           Thu, 16 Feb 2012 00:48:45 GMT
X-Content-Type-Options  nosniff, nosniff
Date                    Thu, 01 Mar 2012 20:58:10 GMT
Expires                 Thu, 01 Mar 2012 22:58:10 GMT
Content-Type            text/javascript
Vary                    Accept-Encoding
Age                     1326
Cache-Control           max-age=7200, public
Server                  GFE/2.0
Transfer-Encoding       chunked
Connection              close

For http://my-site.example/myscript.js:

(Status-Line)           HTTP/1.1 200 OK
Server                  nginx
Date                    Thu, 01 Mar 2012 21:20:16 GMT
Content-Type            application/javascript
Last-Modified           Fri, 10 Feb 2012 17:50:27 GMT
Transfer-Encoding       chunked
Connection              keep-alive
Vary                    Accept-Encoding
Expires                 Thu, 01 Mar 2012 23:20:16 GMT
Cache-Control           max-age=7200, public
Content-Encoding        gzip

When I press F5 on my page, ga.js just loads from cache, but myscript.js gets requested and comes back with 304 Not Modified. What is the magic combo here? And how do I make it load from cache without a server trip until it expires?

EDIT
I am NOT using Google's stock tracking snippet. I am using the following loading code:

<script src="/assets/js/vendor/LAB.min.js"></script>
<script>
  $LAB
    .script("//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js").wait()
    .script("/assets/js/common.js?abc123").wait()
    .script("/assets/js/home.js?abc123")
    .script("/assets/js/stats.js?abc123");
</script>

stats.js

// Google Analytics
var _gaq = [["_setAccount", "UA-XXXXXXXX-1"], ["_trackPageview"]];
$LAB.script("//google-analytics.com/ga.js");

// WebSTAT
// ...

Answer 1

Without seeing the headers for when you reloaded the page it is a little hard to double check some things.

One thing I do notice is that the dates/times don't seem correct (though this may just be an artefact of how you copied and pasted your question). The response from Google's server says the Date is Thu, 01 Mar 2012 20:58:10 GMT while your js says it is Thu, 01 Mar 2012 21:20:16 GMT. If my reading of this page is correct, if your server sets Date headers that are in the future as far as your personal machine is concerned, then the calculated current_age of your cached copy will always be 0 (rounded up from a negative number). This would cause your browser to attempt to validate it by doing a conditional GET which shows up as 304 Not Modified. Google also may be slightly out of sync with your personal machine but with them the Age header is being set and this is used when available if the calculated age value is less that it.

If this is the case, make sure that your web server (and your personal machine) are syncing their time to an internet time server. Look for a regional time server pool and get your machines to sync to them.

Answer 2

Google's code is being called from:

<script src="http://www.google-analytics.com/ga.js" type="text/javascript"></script>

If you'll put your JS code in a file and call it the same way:

<script src="myscript.js" type="text/javascript"></script>

Your script will be cached as well. Check the last paragraph here

Answer 3

On some browsers and in some circumstances (I haven't actually examined the code in sufficient detail to be sure which), LABjs uses different methods for preloading same-domain and cross-domain scripts. It's possible that the preloading method chosen by LABjs for same-domain scripts is suboptimal on your browser.

If so, you might want to report it to the LABjs devs. (Preferably after searching to check that it's not already a known issue, of course.)