Add HTMX preload and optimize syntax highlighting

TorstenDittmann · TorstenDittmann · commit 7ee85a926c7c · 2025-04-13T15:07:24.000+02:00
- Implement preloading via HTMX extension for faster navigation
- Optimize highlight.js by only importing required languages
- Fix code block language from "shell" to "bash"
diff --git a/apps/docs/install.html b/apps/docs/install.html
@@ -4,7 +4,7 @@
 		<h2>Installation</h2>
 		<p>You can install launch.css using your preferred package manager:</p>
 
-		<pre><code class="language-shell">npx nypm add launch.css</code></pre>
+		<pre><code class="language-bash">npx nypm add launch.css</code></pre>
 
 		<p>Or use a CDN:</p>
 		<pre
diff --git a/apps/docs/main.js b/apps/docs/main.js
@@ -1,7 +1,15 @@
-import "htmx.org";
 import "launch.css";
+import "htmx.org";
+import "htmx-ext-preload";
 import "highlight.js/styles/github-dark.css";
-import hljs from "highlight.js";
+import hljs from "highlight.js/lib/core";
+import html from "highlight.js/lib/languages/xml";
+import bash from "highlight.js/lib/languages/bash";
+import javascript from "highlight.js/lib/languages/javascript";
+
+hljs.registerLanguage("html", html);
+hljs.registerLanguage("bash", bash);
+hljs.registerLanguage("javascript", javascript);
 
 function on_mount() {
 	hljs.highlightAll();
diff --git a/apps/docs/package.json b/apps/docs/package.json
@@ -10,6 +10,7 @@
 	},
 	"devDependencies": {
 		"highlight.js": "^11.11.1",
+		"htmx-ext-preload": "^2.1.1",
 		"htmx.org": "^1.9.12",
 		"launch.css": "workspace:*",
 		"vite": "^6.2.0",
diff --git a/apps/docs/partials/base.hbs b/apps/docs/partials/base.hbs
@@ -8,9 +8,9 @@
 		<script defer src="https://cloud.umami.is/script.js" data-website-id="8c20b3c7-dd6d-4e57-bf9d-135879bc574a"></script>
 	</head>
 
-	<body data-layout="website">
+	<body data-layout="website" hx-ext="preload">
 		<header>
-			<nav hx-boost="true">
+			<nav hx-boost="true" preload="mouseover">
 				<a href="/">launch.css</a>
 				<menu>
 					<li><a href="/install">Install</a></li>
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
