Skip to content

Instantly share code, notes, and snippets.

@bgerrissen
Created November 25, 2010 09:52
Show Gist options
  • Save bgerrissen/715141 to your computer and use it in GitHub Desktop.
Save bgerrissen/715141 to your computer and use it in GitHub Desktop.
RequireJS cacheKey

reason

Offers a simple mechanism to allow extremely long expire-headers on scripts whilst still being able to switch to newer versions on the fly.

implementation

A js file defined with data-main attribute on the script tag of require.js, will always be loaded with current timestamp to always force a fresh load.

// main.js?cacheKey=TIMESTAMP-123412312321
<script data-main="main" src="require.js"></script>

Inside main.js you can define a cacheKey that will be appended to all loaded scripts from that point on.

// results in [root]/module.js?cacheKey=v1.0.0
require.cacheKey( "v1.0.0" );
require( "module" , function( module ){ 
    /* code*/} 
);

or using RequireJS config mechanism:

// results in [root]/module.js?cacheKey=v1.0.0
require( {
    cacheKey: "v1.0.0"
} , "module" , function( module ){ 
    /* code*/} 
);

Set extreme long expire headers on .js files and you get optimal browser caching whilst able to update an entire dependency tree by setting one value.

As an alternative to setting the cacheKey variable in javascript, it could also be passed by another data- attribute. (from Smith, see comments)

<script data-main="main" data-cacheKey="v1.0.0" src="require.js"></script>

This allows both development teams (backend/frontend) to be able to control the cacheKey. However a question of what overrides what remains.

As a bonus, you could opt to override cacheKey usage with a path-expression plugin (see path-expression gist).

// not a pretty path-expression I admit.
require( "module !nocachekey" , function( module ){ 
    /* code*/} 
);
@jrburke
Copy link

jrburke commented May 30, 2012

requirejs will merge config calls but it does not do a real deep merge. The first level or two is merged. Depends on the config setting.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment