Suggestion: cache-busting token as part of image URL

[tomcardoso]

As part of our ai2html instance, we've added simple URL-based cache busting through a token query string. Basically, instead of a URL looking like this:

https://example.com/slug/desktop.png

… it looks like this (in this case, the 8th instance of the ai2html script having run for the graphic):

https://example.com/slug/desktop.png?token=8

This has been very useful for us, since it allows us a way of automatically busting the cache on an ai2html graphic, especially if it's getting updated a lot throughout the day (i.e., maps during breaking news situations). Our image caching system right now (using WaPo's Arc platform) doesn't have any programmatic cache busting, so we end up renaming URLs with new token strings a lot.

The way it works is I've implemented an ai2html-build block in our .ai template that increments each time the script is run, which is then appended to the image URL:

Is there interest in something like this? Not sure how the NYT handles cache busting, but a general cache-busting solution would be great. Perhaps it's an option that can be toggled on or off in ai2html-settings? The only caveat with this system is that you need to publish the images before publishing the new HTML, or the new cache string'ed HTML will load the old images first and the cache busting is pointless.

For example purposes, there are a ton of ai2html graphics using this system here: https://www.theglobeandmail.com/news/national/a-tale-of-two-canadas-where-you-grow-up-affects-your-adult-income/article35444594/

[mbloch]

Hi Tom,

The NYT doesn't do cache busting this way anymore, but if it's a common need for other users, we should consider adding it to the script. The simplest option would be a setting that gets updated manually (in the ai2html-settings block) -- but it sounds like you have an automatic solution. Do you have a fork of the project that I could look at, or can you submit a pull request?

Here's how I think it works now at the Times (although I'm not 100% sure). In some contexts, when we upload a new image or other asset, our CMS sends our CDN a "purge" command. The CDN takes care of setting the correct headers to make sure that browsers get the latest version of the asset.

For other project types, new assets are published to a different url, so cache busting is not needed -- like this: https://static01.nyt.com/newsgraphics/2017/10/02/las-vegas-shooting/7fe54b9314a49244c9760ce8f2efb53516486312/vegas-ge-close-1050.jpg

[tomcardoso]

Yeah, ideally we'd have a similar system, but under our CMS (WaPo's Arc), we don't really have control of the CDN, so we can't issue purge commands, hence the query string thing. We do have a fork here: https://github.com/globeandmail/ai2html

The code I wrote to do the build incrementing is here: https://github.com/globeandmail/ai2html/blob/master/ai2html.js#L1763-L1768

Then it's just a locked layer, like this: https://www.dropbox.com/s/vblt1kvqkuwisew/Screen%20Shot%202018-04-06%20at%2012.59.13%20PM.png?dl=0

If this looks good to you, happy to submit a PR, BTW.

[mbloch]

Thanks, I'll have a look... I'm making time to catch up on outstanding ai2html issues, so it shouldn't be too long this time.

[mbloch]

I just pushed a commit (0f3c2fde3b3562141) that adds similar functionality. There's a new setting, "cache_bust_token". If you set the value to 1 (or any positive integer), the token will auto-increment after every run.

The "cache_bust_token" setting goes in the main ai2html-settings text block, rather than in a separate text frame (I thought it would be easier for most people to use this way). If "cache_bust_token" is set in the default settings but not in the settings text block, it will automatically get added to the settings block.

Hope this is useful, please let me know if you think it should work differently than this.

[tomcardoso]

Sorry, totally forgot to reply to this, but looks awesome! Will merge this into our fork soon.