One of the biggest hassles when trying to track down and squash bugs in a large-scale production environment is dealing with multiple layers of caching.
Many of the sites I work on are at least three layers deep: a content delivery network (like Limelight or Akamai), server level file caching (like the W3 Total Cache plugin for WordPress) and the browser’s cache. Forgetting to clear one of those layers has often resulted in lots of time spent trying to debug a problem that’s already been fixed.
Anyhow, I put together a bookmarklet that helps make dealing with this a little less painful. A pretty typical way of getting around a cache is by adding a random query string to the end of the url; this usually bypasses most caches and gives you a “fresh” version of the page. So I put together a simple bookmarklet that reloads the current page your on with a time-stamped query string—resulting in a “fresh” version you can check for problems before purging the old caches.
Nutshell: this bookmarklet reloads your page with a unique query string:
You know the drill: drag it to your bookmark toolbar and click for a minty burst of freshness.
I looked around for a solution to this and found Jason Beaird’s CSS Cache Busting bookmarklet which proved to be a good starting point, but had to rewrite it to include scripts since I’m constantly getting frustrated with cached scripts as well.
Nutshell: this bookmarklet adds a unique query string to all of the included scripts and stylesheets on your page:
Please take, use, enjoy—hopefully this saves you some time. If you have any feedback or cool tweaks, feel free to post them in the comments!