Zola CSS cache invalidation template


#css #ssg #zola

I added CSS invalidation to my base.html template for this website.

My nginx cache policy is set to be very long to avoid unecessarily refech ressources already cached. This works, until I change my website's css...

Browsers aren't being told to refetch the new css file. This is why I needed the cache invalidation.

I decided to use the ?v=... method, where I add a timestamp at the end of the href= of the css link tag.

<link
  rel="stylesheet"
  type="text/css"
  href="/css/styles.css?v={{ now() | date(format='%Y%m%d%H%M%S') }}">

Every time I deploy my site, the ?v= is bumped to the current time, thus always invalidating the previously cached CSS file.

And it works well enough.

Apparently, it is not super efficiently, and there are other ways to do this.

↑ top