As described in my previous post, I have recently started a music blog, using quarto, and placed it on a subdomain of the main site. I then wanted to add yet another blog in another subdomain, also created with quarto, this one on long covid (hello there, fellow long covid sufferers, let’s connect). However, as I pushed the new blog to the server and viewed the result: I was puzzled: it looked exactly like the music blog, even though I applied a different theme and it should therefore have looked different.

After a bit of head-scratching, I realised that the problem was browser caching: To make your browsing experience slicker, browsers cache or keep some information about websites you visit so they can reload it faster once you’re back. As all the files regarding styling had the same names for both subdomains (even though their content was different), the browser cached this and made the second blog I visited look like the first.

Once I identified the problem, I still needed a solution: I somehow needed to prevent the browser from wrongly caching styling files. The workaround I came up with is that for each blog, I version the relevant css files in the deployment pipeline (a github action, e.g. version=m for the music blog). Problem solved, and for a very brief moment, I felt a bit like a web developer (not that this is something I’d like to make permanent!).