feat: cache-bust static assets with CSS content hash on startup

This commit is contained in:
M1 2026-03-17 09:44:18 +04:00
parent 6342ec907f
commit 41bfe52f10
2 changed files with 9 additions and 4 deletions

View File

@ -4,6 +4,11 @@ import { resolve } from "path";
import { resolveKey } from "./auth"; import { resolveKey } from "./auth";
import sql from "../db"; import sql from "../db";
import { sparkline } from "../utils/sparkline"; import { sparkline } from "../utils/sparkline";
import { createHash } from "crypto";
// Generate a cache-buster hash from the CSS file content at startup
const cssFile = Bun.file(resolve(import.meta.dir, "../dashboard/tailwind.css"));
const cssHash = createHash("md5").update(await cssFile.bytes()).digest("hex").slice(0, 8);
const eta = new Eta({ views: resolve(import.meta.dir, "../views"), cache: true, defaultExtension: ".ejs" }); const eta = new Eta({ views: resolve(import.meta.dir, "../views"), cache: true, defaultExtension: ".ejs" });
@ -56,7 +61,7 @@ function escapeHtmlSSR(str: string): string {
} }
function html(template: string, data: Record<string, unknown> = {}) { function html(template: string, data: Record<string, unknown> = {}) {
return new Response(eta.render(template, { ...data, timeAgoSSR, sparklineSSR, latencyChartSSR, escapeHtmlSSR }), { return new Response(eta.render(template, { ...data, timeAgoSSR, sparklineSSR, latencyChartSSR, escapeHtmlSSR, cssHash }), {
headers: { "content-type": "text/html; charset=utf-8" }, headers: { "content-type": "text/html; charset=utf-8" },
}); });
} }

View File

@ -4,9 +4,9 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PingQL<%= it.title ? ` — ${it.title}` : '' %></title> <title>PingQL<%= it.title ? ` — ${it.title}` : '' %></title>
<link rel="stylesheet" href="/dashboard/tailwind.css"> <link rel="stylesheet" href="/dashboard/tailwind.css?v=<%= it.cssHash %>">
<link rel="stylesheet" href="/dashboard/app.css"> <link rel="stylesheet" href="/dashboard/app.css?v=<%= it.cssHash %>">
<script src="/dashboard/app.js?v=2"></script> <script src="/dashboard/app.js?v=<%= it.cssHash %>"></script>
<% if (it.scripts) { it.scripts.forEach(function(s) { %> <% if (it.scripts) { it.scripts.forEach(function(s) { %>
<script src="<%= s %>"></script> <script src="<%= s %>"></script>
<% }) } %> <% }) } %>