add ondemand

_config.ts

@@ -22,6 +22,7 @@ import phosphor from "https://deno.land/x/[email protected]/phosphor.ts";
 import picture from "lume/plugins/picture.ts";
 import transformImages from "lume/plugins/transform_images.ts";
 import brotli from "lume/plugins/brotli.ts";
+import onDemand from "lume/plugins/on_demand.ts";
 
 const site = lume(
   {
@@ -60,6 +61,16 @@ site.use(transformImages({
   matches: /\.(jpg|jpeg|png|webp)$/i, // This regex matches only image files
 }));
 site.use(brotli());
+site.use(onDemand({
+  extraData(request: Request) {
+    const searchParams = new URL(request.url).searchParams;
+    const params = Object.fromEntries(searchParams.entries());
+
+    return {
+      params,
+    };
+  },
+}));
 
 site.copy("assets");
 // site.copy("static/portfolio", "portfolio");

_preload.ts

@@ -0,0 +1,9 @@
+/**
+ * Don't execute this function
+ * It's just statically analyzable so dynamic imports work on Deno Deploy
+ * @see https://deno.com/deploy/changelog#statically-analyzable-dynamic-imports
+ */
+export function toStaticallyAnalyzableDynamicImports() {
+  import("./src/archive/index.ts");
+  import("./src/_data.ts");
+}

_routes.json

@@ -0,0 +1,3 @@
+{
+  "/ondemand/": "/ondemand.vto"
+}

serve.ts

@@ -3,6 +3,8 @@ import Server from "lume/core/server.ts";
 import precompress from "lume/middlewares/precompress.ts";
 import expires from "lume/middlewares/expires.ts";
 import csp from "https://raw.githubusercontent.com/lumeland/experimental-plugins/main/csp/mod.ts";
+import onDemand from "lume/middlewares/on_demand.ts";
+import "./_preload.ts";
 
 //import csp from "https://raw.githubusercontent.com/RickCogley/experimental-plugins/refs/heads/main/csp/mod.ts";
 
@@ -50,6 +52,8 @@ server.use(csp({
   "X-Powered-By": "Lume and sweat, blood, and tears",
 }));
 
+server.use(onDemand({ site }));
+
 server.start();
 
 console.log("Listening on http://localhost:8000");

src/ondemand.vto

@@ -0,0 +1,6 @@
+---
+layout: layouts/base.vto
+ondemand: true
+---
+
+Hello {{ params.name }}