Add hash fingerprinting for asset caching

Author: jiwonac

.eleventy.js

@@ -1,5 +1,6 @@
 const markdownIt = require("markdown-it");
 const pluginRss = require("@11ty/eleventy-plugin-rss");
+const cacheBuster = require("@mightyplow/eleventy-plugin-cache-buster");
 const fs = require("fs");
 const path = require("path");
 const { generateImage } = require("./src/_11ty/images");
@@ -41,6 +42,7 @@ module.exports = function(eleventyConfig) {
     eleventyConfig.addPassthroughCopy("src/_scripts/microblog-cards.js");
     eleventyConfig.addPassthroughCopy("src/favicon.ico");
     eleventyConfig.addPassthroughCopy("src/robots.txt");
+    eleventyConfig.addPassthroughCopy("src/.htaccess");
     eleventyConfig.addPassthroughCopy("src/assets");
     eleventyConfig.addPassthroughCopy("src/admin");
 
@@ -82,6 +84,11 @@ module.exports = function(eleventyConfig) {
     /* Enable RSS */
     eleventyConfig.addPlugin(pluginRss);
 
+    /* Cache busting for CSS/JS assets */
+    eleventyConfig.addPlugin(cacheBuster({
+        outputDirectory: "_site"
+    }));
+
     /* Date formatting filter */
     eleventyConfig.addFilter("formatDate", (date) => {
         const d = new Date(date);

package-lock.json

@@ -14,6 +14,7 @@
   "dependencies": {
     "@11ty/eleventy": "^2.0.0",
     "@11ty/eleventy-img": "^6.0.4",
+    "@mightyplow/eleventy-plugin-cache-buster": "^1.1.3",
     "markdown-it": "^13.0.2"
   },
   "devDependencies": {

package.json

@@ -1 +1,20 @@
-ErrorDocument 404 /404.html
+ErrorDocument 404 /404.html
+
+# Cache static assets (safe with cache-busting enabled)
+<IfModule mod_expires.c>
+    ExpiresActive On
+    ExpiresByType image/webp "access plus 1 year"
+    ExpiresByType image/png "access plus 1 year"
+    ExpiresByType image/jpeg "access plus 1 year"
+    ExpiresByType image/svg+xml "access plus 1 year"
+    ExpiresByType text/css "access plus 1 year"
+    ExpiresByType application/javascript "access plus 1 year"
+    ExpiresByType font/woff2 "access plus 1 year"
+    ExpiresByType font/woff "access plus 1 year"
+</IfModule>
+
+<IfModule mod_headers.c>
+    <FilesMatch "\.(css|js|webp|png|jpg|woff2)$">
+        Header set Cache-Control "public, max-age=31536000, immutable"
+    </FilesMatch>
+</IfModule>