JS and CSS assets caching guidelines

We are aggressively caching JavaScript and CSS assets. To avoid caching issues we recommend that you leverage WordPress' builtin asset versionning feature.

1. Version constant

To avoid needing to change the asset version in multiple places we recommend that you declare a constant in your plugin or theme. Please note that the syntax is different for each.

For a theme (usually placed at the top of functions.php):

$mythemeprefix_data = wp_get_theme( 'my-theme-slug' ); //theme slug is usually the github repo name.

define( 'MYTHEMEPREFIX_VERSION', $mythemeprefix_data->get( 'Version' ) );

For a plugin (usually placed at the top of the plugin bootstrap file):

$mypluginprefix_data = get_file_data( __FILE__, array( 'Version' => 'Version' ), 'plugin' );

define( 'MYPLUGINPREFIX_VERSION', $mypluginprefix_data['Version'] );

2. Using the constant when enqueuing assets.

Now that you have declared your constant, you can use it whenever you enqueue a new asset using it as the value for the $version parameter, see wp_enqueue_script / wp_enqueue_style

• Before:

  wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), '1.0.0', true );

• After:

  wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), MYPLUGINPREFIX_VERSION, true );
  
  

3. Increment your theme or plugin version at each PR.

All you have to do now is to increment the plugin or theme version at each PR. Theme version is defined in the top comment of style.css. Plugin version is defined at the top of the plugin bootstrap file.