{
"$type": "site.standard.document",
"createdAt": "2024-04-18T13:13:00+01:00",
"description": "How to cache bust static assets when you're just running a naïve script for website deploys.",
"path": "/stream/more-cache-busting",
"publishedAt": "2024-04-18T13:13:00+01:00",
"site": "at://did:plc:swxoj3wjlwodcqs5ipmvgnug/site.standard.publication/3mnv7gbn3czno",
"tags": [
"Web",
"Code"
],
"textContent": "I wrote a little bit, a while ago, about my cache busting strategy for this website. The basic idea is to generate a unique identifier at the time of deploy, and then use that unique identifier as a query param for requests to static assets. So that if I haven't deployed in a while, and on the off chance that I have a repeat visitor to this website, that visitor gets the cached version of my (admittedly minimal) CSS and JavaScript. When I re-deploy the website, that visitor's browser will determine that something has changed and reload the files.Previously, when this website was redeployed using GitHub Actions, I used the ID of the action's run as the unique identifier—on the basis of that identifier being incremented on every deploy.Now that I deploy manually, I no longer have that identifier. So I use a random hexadecimal string instead:VERSION=$(openssl rand -hex 4) grep -rl '{|{VERSION}|}' ./templates | xargs sed -i \"s/{|{VERSION}|}/$VERSION/g\"This finds all files in my templates directory that have the {|{VERSION}|} string in them (just a distinctive string that I likely won't be using anywhere else)—and then uses sed to replace that string, inline with my random identifier.I suppose I could be doing something clever like hashing each of the files, so the ID doesn't change unless the file does—but this works, and works well for a website of this scale.",
"title": "More cache busting"
}