diff --git a/www/deno.json b/www/deno.json
index ebd516898..728d29f23 100644
--- a/www/deno.json
+++ b/www/deno.json
@@ -1,6 +1,6 @@
 {
   "tasks": {
-    "dev": "deno run -A lib/watch.ts components docs lib plugins routes -- deno run -A --lock-write main.tsx"
+    "dev": "deno run -A lib/watch.ts components docs lib plugins routes -- deno run -A main.tsx"
   },
   "lint": {
     "exclude": ["docs/esm"],
@@ -17,8 +17,8 @@
     "jsxImportSource": "revolution"
   },
   "imports": {
-    "effection": "https://deno.land/x/effection@3.0.0-beta.2/mod.ts",
-    "revolution": "https://deno.land/x/revolution@0.5.2/mod.ts",
-    "revolution/jsx-runtime": "https://deno.land/x/revolution@0.5.2/jsx-runtime.ts"
+    "effection": "https://deno.land/x/effection@3.0.3/mod.ts",
+    "revolution": "https://deno.land/x/revolution@0.6.0/mod.ts",
+    "revolution/jsx-runtime": "https://deno.land/x/revolution@0.6.0/jsx-runtime.ts"
   }
 }
diff --git a/www/deno.lock b/www/deno.lock
index 87ddc3774..9b1807d93 100644
--- a/www/deno.lock
+++ b/www/deno.lock
@@ -2,6 +2,7 @@
   "version": "3",
   "packages": {
     "specifiers": {
+      "jsr:@libs/xml": "jsr:@libs/xml@5.4.13",
       "jsr:@std/assert@^0.219.1": "jsr:@std/assert@0.219.1",
       "jsr:@std/async@^0.219.1": "jsr:@std/async@0.219.1",
       "jsr:@std/cli@^0.219.1": "jsr:@std/cli@0.219.1",
@@ -28,6 +29,9 @@
       "npm:unified@10.1.2": "npm:unified@10.1.2"
     },
     "jsr": {
+      "@libs/xml@5.4.13": {
+        "integrity": "995320d1ce4a29ced82233e5e46d47a880e338197bbd257a686bf9afcc3ac0e4"
+      },
       "@std/assert@0.219.1": {
         "integrity": "e76c2a1799a78f0f4db7de04bdc9b908a7a4b821bb65eda0285885297d4fb8af"
       },
@@ -1577,6 +1581,8 @@
     "https://deno.land/std@0.158.0/testing/_diff.ts": "a23e7fc2b4d8daa3e158fa06856bedf5334ce2a2831e8bf9e509717f455adb2c",
     "https://deno.land/std@0.158.0/testing/_format.ts": "cd11136e1797791045e639e9f0f4640d5b4166148796cad37e6ef75f7d7f3832",
     "https://deno.land/std@0.158.0/testing/asserts.ts": "8696c488bc98d8d175e74dc652a0ffbc7fca93858da01edc57ed33c1148345da",
+    "https://deno.land/std@0.188.0/_util/asserts.ts": "178dfc49a464aee693a7e285567b3d0b555dc805ff490505a8aae34f9cfb1462",
+    "https://deno.land/std@0.188.0/flags/mod.ts": "17f444ddbee43c5487568de0c6a076c7729cfe90d96d2ffcd2b8f8adadafb6e8",
     "https://deno.land/std@0.201.0/assert/assert.ts": "9a97dad6d98c238938e7540736b826440ad8c1c1e54430ca4c4e623e585607ee",
     "https://deno.land/std@0.201.0/assert/assertion_error.ts": "4d0bde9b374dfbcbe8ac23f54f567b77024fb67dbb1906a852d67fe050d42f56",
     "https://deno.land/std@0.201.0/encoding/base32.ts": "c329447451560ec692b9eb4d1badb6437f1d419ddbb21c1f994b0fe0b6b66cc8",
@@ -1812,6 +1818,7 @@
     "https://deno.land/x/effection@3.0.3/lib/run/frame.ts": "132fdace9c00e6ad0e249d7faab1c33680336c5fa8e4a893f092ecec4e2df786",
     "https://deno.land/x/effection@3.0.3/lib/run/scope.ts": "a968455e313ba9aa097ee5c18b4db0d8e2397b90c78e413fa08396baead7b74a",
     "https://deno.land/x/effection@3.0.3/lib/run/task.ts": "7084b9cabdc338c776dc522ec8b677fb3ac41aa0c94e454d467731494cb68737",
+    "https://deno.land/x/effection@3.0.3/lib/run/types.ts": "010bea700f68fef99dd87ca5ca3cbbc90e026ac467889d8429d39cba0ee55fda",
     "https://deno.land/x/effection@3.0.3/lib/run/value.ts": "d57428b45dfeecc9df1e68dadf8697dbc33cd412e6ffcab9d0ba4368e8c1fbd6",
     "https://deno.land/x/effection@3.0.3/lib/shift-sync.ts": "74ecefa9cb2e145a3c52f363319f8d6296b804600852044b7d14bd53bc10b512",
     "https://deno.land/x/effection@3.0.3/lib/signal.ts": "6aba1f372419e1540bd29a9ff992ffd2500e035b2e455d2c11d856a052f698d1",
@@ -1827,6 +1834,7 @@
     "https://deno.land/x/esbuild_deno_loader@0.8.2/src/plugin_deno_loader.ts": "166356133ee63d80e5559a10c18e10b625da96e39a4518b8c7adfef718bb4e32",
     "https://deno.land/x/esbuild_deno_loader@0.8.2/src/plugin_deno_resolver.ts": "0449ed23ae93db1ec74d015a46934aefd7ba7a8f719f7a4980b616cb3f5bbee4",
     "https://deno.land/x/esbuild_deno_loader@0.8.2/src/shared.ts": "33052684aeb542ebd24da372816bbbf885cd090a7ab0fde7770801f7f5b49572",
+    "https://deno.land/x/hastx@v0.0.10/deps.ts": "6c9b4e0a1d0120f3be92d74baa68b83b3730de22e7c4fdee7b2631189a8b3336",
     "https://deno.land/x/hastx@v0.0.10/html.ts": "54f86c5378dd7282142c9847efaf20b7ee244743f16af20a62900e912d1ae810",
     "https://deno.land/x/importmap@0.2.1/_util.ts": "ada9a9618b537e6c0316c048a898352396c882b9f2de38aba18fd3f2950ede89",
     "https://deno.land/x/importmap@0.2.1/mod.ts": "ae3d1cd7eabd18c01a4960d57db471126b020f23b37ef14e1359bbb949227ade",
@@ -1851,6 +1859,27 @@
     "https://deno.land/x/revolution@0.5.2/lib/server.ts": "560765955e3d6129f8f5d9fcaf4f598ddb0b9543db766f7a1a8d18d360b0a07c",
     "https://deno.land/x/revolution@0.5.2/lib/sse.ts": "df0a18d90ab20e4c707c59240a942c347bc7aa22c48601cb3a49ca12458a6e30",
     "https://deno.land/x/revolution@0.5.2/lib/types.ts": "2f32cbc673d496b5a37e5b9ff829577866d66a19b993ed59840b92700861d237",
-    "https://deno.land/x/revolution@0.5.2/mod.ts": "ffae461c16d4a1bf24c2179582ab8d5c81ad0df61e4ae2fba51ef5e5bdf90345"
+    "https://deno.land/x/revolution@0.5.2/mod.ts": "ffae461c16d4a1bf24c2179582ab8d5c81ad0df61e4ae2fba51ef5e5bdf90345",
+    "https://deno.land/x/revolution@0.6.0/jsx-runtime.ts": "b0d18239c9202c8881750902a8d19b07d84361ca4ab178edb1fd46b3542fd9a6",
+    "https://deno.land/x/revolution@0.6.0/lib/assertions.ts": "a3e142cc30ad9530fa97edecbc94272eefdd9398d927ba18b9e79684d6335889",
+    "https://deno.land/x/revolution@0.6.0/lib/builder.ts": "6d96073ef323ed5db796eaf5065b8f1a298552e9174c3da3d96a5e124c5b94a7",
+    "https://deno.land/x/revolution@0.6.0/lib/deps/effection.ts": "036e0ed764abc7550f2138391eb7119644f3cbc19433196459b126c85f5ffad7",
+    "https://deno.land/x/revolution@0.6.0/lib/deps/hast.ts": "c18e53e92fadfc87f4e27d7568a3d764e8059d38ce54a4f02dc75451c0f716e6",
+    "https://deno.land/x/revolution@0.6.0/lib/deps/std.ts": "b4e46fe71aef45c02e10825ac60aa8bf36dfb38d054dfb10f9b2d1bed8be9aef",
+    "https://deno.land/x/revolution@0.6.0/lib/island.ts": "7bfebfdc877648aadead95db7acab1ce249f43fb512bf11d6bb78727350012da",
+    "https://deno.land/x/revolution@0.6.0/lib/middleware.ts": "7e48ef017613fdd55488e4334b6027a4c41ec2a020c46df8090899f9497a32cb",
+    "https://deno.land/x/revolution@0.6.0/lib/middleware/concat.ts": "e875397258a40e8a948251876ab03945df2bb2ff67d8974a6fa299772a5ee5f5",
+    "https://deno.land/x/revolution@0.6.0/lib/middleware/dispatch.ts": "1af530a1c479fde6cc4d31f423f2fc03fc2b81f30bbb19800c3c0f478ef2a40a",
+    "https://deno.land/x/revolution@0.6.0/lib/middleware/http-responses.ts": "cce163033268305d3176a077176bba3a2df5da11c491c297cf20b8cc4dcb6bac",
+    "https://deno.land/x/revolution@0.6.0/lib/middleware/island-middleware.ts": "91c482145220521adb5d39a2b68a8c5fb3c695d7bb8b02de8bb1b7635743d5a3",
+    "https://deno.land/x/revolution@0.6.0/lib/middleware/serialize-html.ts": "dc4e6facc5db369b6f1a30a89901ea4fdce3715d625e226c5017f45e38d780e4",
+    "https://deno.land/x/revolution@0.6.0/lib/middleware/serve-dir.ts": "d9fd3f00ee153bac537e00fcad6df810ecf4bba645cf87924bd4780b6923c426",
+    "https://deno.land/x/revolution@0.6.0/lib/mod.ts": "0466ad5b79d6a76499f59c7f4ef941797fba496592cd5db954a3ba68b0b9362f",
+    "https://deno.land/x/revolution@0.6.0/lib/revolution.ts": "95ea50024cc35b65133e64c353c7aef15c792fbb033839c1b9bf7725bbb6cf8d",
+    "https://deno.land/x/revolution@0.6.0/lib/route.ts": "2043d2d7c857015d0c998aa7bfffd6b00fbc47f8adf7305abf9b691ff45a0a91",
+    "https://deno.land/x/revolution@0.6.0/lib/server.ts": "560765955e3d6129f8f5d9fcaf4f598ddb0b9543db766f7a1a8d18d360b0a07c",
+    "https://deno.land/x/revolution@0.6.0/lib/sse.ts": "3ace8fd4b2935e264940511366513bfeb5b414e457bc3d6a916d123b20a80d3c",
+    "https://deno.land/x/revolution@0.6.0/lib/types.ts": "2f32cbc673d496b5a37e5b9ff829577866d66a19b993ed59840b92700861d237",
+    "https://deno.land/x/revolution@0.6.0/mod.ts": "ffae461c16d4a1bf24c2179582ab8d5c81ad0df61e4ae2fba51ef5e5bdf90345"
   }
 }
diff --git a/www/docs/docs.ts b/www/docs/docs.ts
index 078eabfd5..001aa00ea 100644
--- a/www/docs/docs.ts
+++ b/www/docs/docs.ts
@@ -1,5 +1,12 @@
-import { call, type Operation, resource, type Task, useScope } from "effection";
-import structure from "./structure.json" assert { type: "json" };
+import {
+  all,
+  call,
+  type Operation,
+  resource,
+  type Task,
+  useScope,
+} from "effection";
+import structure from "./structure.json" with { type: "json" };
 
 import { basename } from "https://deno.land/std@0.205.0/path/posix/basename.ts";
 
@@ -19,6 +26,7 @@ export interface DocModule {
 }
 
 export interface Docs {
+  all(): Operation<Doc[]>;
   getDoc(id?: string): Operation<Doc | undefined>;
 }
 
@@ -102,6 +110,12 @@ export function loadDocs(): Operation<Docs> {
     }
 
     yield* provide({
+      *all() {
+        if (!loaders) {
+          loaders = yield* load();
+        }
+        return yield* all([...loaders.values()]);
+      },
       *getDoc(id) {
         if (id) {
           if (!loaders) {
diff --git a/www/lib/watch.ts b/www/lib/watch.ts
index 354aa4426..ad27b02f6 100644
--- a/www/lib/watch.ts
+++ b/www/lib/watch.ts
@@ -1,10 +1,7 @@
 import {
-  action,
-  filter,
-  first,
-  pipe,
+  call,
+  main,
   resource,
-  run,
   sleep,
   type Stream,
   stream,
@@ -15,7 +12,7 @@ import { parse } from "https://deno.land/std@0.188.0/flags/mod.ts";
 
 import { useCommand } from "./use-command.ts";
 
-await run(function* () {
+await main(function* () {
   let scriptargs = parse(Deno.args, {
     "--": true,
   });
@@ -28,49 +25,36 @@ await run(function* () {
   console.log(`watch: ${JSON.stringify(paths)}`);
   console.log(`run: ${cmd} ${args.join(" ")}`);
 
-  yield* action<void>(function* (resolve) {
-    Deno.addSignalListener("SIGINT", resolve);
-    try {
-      while (true) {
-        yield* action(function* (restart) {
-          let change = pipe(
-            useFsWatch(paths),
-            filter(function* (event) {
-              return !event.paths.some((path) =>
-                ignores.some((ignore) => path.includes(ignore))
-              );
-            }),
-          );
-
-          yield* useCommand(cmd, { args });
-
-          yield* first(change);
+  while (true) {
+    yield* call(function* () {
+      let changes = yield* useFsWatch(paths);
 
-          yield* sleep(100);
+      yield* useCommand(cmd, { args });
 
-          console.log("changes detected, restarting...");
-
-          restart();
-        });
+      while (true) {
+        let { value: change } = yield* changes.next();
+        if (
+          !change.paths.some((path) =>
+            ignores.some((ignore) => path.includes(ignore))
+          )
+        ) {
+          break;
+        }
       }
-    } finally {
-      Deno.removeSignalListener("SIGINT", resolve);
-    }
-  });
+      yield* sleep(100);
+      console.log("changes detected, restarting...");
+    });
+  }
 });
 
 function useFsWatch(paths: string | string[]): Stream<Deno.FsEvent, never> {
-  return {
-    subscribe() {
-      return resource(function* (provide) {
-        let watcher = Deno.watchFs(paths);
-        try {
-          let subscription = yield* stream(watcher).subscribe();
-          yield* provide(subscription as Subscription<Deno.FsEvent, never>);
-        } finally {
-          watcher.close();
-        }
-      });
-    },
-  };
+  return resource(function* (provide) {
+    let watcher = Deno.watchFs(paths);
+    try {
+      let subscription = yield* stream(watcher);
+      yield* provide(subscription as Subscription<Deno.FsEvent, never>);
+    } finally {
+      watcher.close();
+    }
+  });
 }
diff --git a/www/main.tsx b/www/main.tsx
index e3fad3f51..727da08a0 100644
--- a/www/main.tsx
+++ b/www/main.tsx
@@ -1,6 +1,6 @@
 import { main, suspend } from "effection";
 
-import { createRevolution, route } from "revolution";
+import { createRevolution } from "revolution";
 import { docsRoute } from "./routes/docs-route.tsx";
 import { indexRoute } from "./routes/index-route.tsx";
 import { v2docsRoute } from "./routes/v2docs-route.tsx";
@@ -11,6 +11,7 @@ import { config } from "./tailwind.config.ts";
 import { twindPlugin } from "./plugins/twind.ts";
 import { rebasePlugin } from "./plugins/rebase.ts";
 import { etagPlugin } from "./plugins/etag.ts";
+import { route, sitemapPlugin } from "./plugins/sitemap.ts";
 
 import { loadDocs } from "./docs/docs.ts";
 import { loadV2Docs } from "./docs/v2-docs.ts";
@@ -34,6 +35,7 @@ await main(function* () {
       twindPlugin({ config }),
       etagPlugin(),
       rebasePlugin(),
+      sitemapPlugin(),
     ],
   });
 
diff --git a/www/plugins/rebase.ts b/www/plugins/rebase.ts
index a06ebb43f..1f2d1c385 100644
--- a/www/plugins/rebase.ts
+++ b/www/plugins/rebase.ts
@@ -61,14 +61,22 @@ export function rebasePlugin(): RevolutionPlugin {
  * with protocol.
  */
 export function* useAbsoluteUrl(path: string): Operation<string> {
-  let normalizedPath = posixNormalize(path);
-  if (normalizedPath.startsWith("/")) {
-    let base = yield* BaseUrl;
-    let url = new URL(base);
-    url.pathname = posixNormalize(`${base.pathname}${path}`);
-    return url.toString();
-  } else {
-    let request = yield* CurrentRequest;
-    return new URL(path, request.url).toString();
+  let absolute = yield* useAbsoluteUrlFactory();
+  return absolute(path);
+}
+
+export function* useAbsoluteUrlFactory(): Operation<(path: string) => string> {
+  let base = yield* BaseUrl;
+  let request = yield* CurrentRequest;
+
+  return (path) => {
+    let normalizedPath = posixNormalize(path);
+    if (normalizedPath.startsWith("/")) {
+      let url = new URL(base);
+      url.pathname = posixNormalize(`${base.pathname}${path}`);
+      return url.toString();
+    } else {
+      return new URL(path, request.url).toString();
+    }
   }
 }
diff --git a/www/plugins/sitemap.ts b/www/plugins/sitemap.ts
new file mode 100644
index 000000000..7516e1693
--- /dev/null
+++ b/www/plugins/sitemap.ts
@@ -0,0 +1,125 @@
+import type { Middleware, RevolutionPlugin } from "revolution";
+import { useRevolutionOptions, route as revolutionRoute } from "revolution";
+import type { Operation } from "effection";
+import { stringify } from "jsr:@libs/xml";
+import { compile } from "https://deno.land/x/path_to_regexp@v6.2.1/index.ts";
+import { useAbsoluteUrlFactory } from "./rebase.ts";
+
+export function sitemapPlugin(): RevolutionPlugin {
+  return {
+    *http(request, next) {
+      let options = yield* useRevolutionOptions();
+      let url = new URL(request.url);
+
+      if (url.pathname === "/sitemap.xml") {
+	let app = options.app ?? [];
+	let paths: RoutePath[] = [];
+	for (let middleware of app) {
+	  let ext = middleware as SitemapExtension;
+	  if (ext.sitemapExtension) {
+	    paths = paths.concat(yield* ext.sitemapExtension(request));
+	  }
+	}
+
+	let absolute = yield* useAbsoluteUrlFactory();
+
+	let xml = stringify({
+	  "@version": "1.0",
+	  "@encoding": "UTF-8",
+	  urlset: {
+	    "@xmlns": "http://www.sitemaps.org/schemas/sitemap/0.9",
+	    url: paths.map((path) => {
+	      let { pathname, ...entry } = path;
+
+	      return {
+		loc: absolute(pathname),
+		...entry,
+	      };
+	    }),
+	  },
+	});
+
+	return new Response(xml, {
+	  status: 200,
+	  headers: {
+	    "Content-Type": "application/xml",
+	  },
+	});
+      }
+      return yield* next(request);
+    },
+  };
+}
+
+export interface SitemapExtension {
+  sitemapExtension?(request: Request): Operation<RoutePath[]>;
+}
+
+export interface RoutePath {
+  pathname: string;
+  lastmod?: string;
+  changefreq?:
+    | "always"
+    | "hourly"
+    | "daily"
+    | "weekly"
+    | "monthly"
+    | "yearly"
+    | "never";
+  priority?: number;
+}
+
+/**
+ * Just like a route, but generates a sitemap for all the urls
+ */
+export interface SitemapRoute<T> {
+  /**
+   * The HTTP or HTML handler for this route
+   */
+  handler: Middleware<Request, T>;
+
+  /**
+   * Generate a list of paths for this route. It will be passed a function which
+   * will substitute in the parameters of the route to generate the path as a string.
+   * For example:
+   *
+   * ```ts
+   * // assuming a route pattern:  "/users/:username"
+   * generate({ username: 'cowboyd' }) //=> "/users/cowboyd"
+   * ```
+   * @param generate - a function to generate a single pathname
+   * @param request - the request for the sitemap
+   * @returns a list of `RoutePath` values
+   */
+  routemap?(
+    generate: (params?: Record<string, string>) => string,
+    request: Request,
+  ): Operation<RoutePath[]>;
+}
+
+export function route<T>(
+  pattern: string,
+  middleware: Middleware<Request, T> | SitemapRoute<T>,
+): Middleware<Request, T> {
+  if (isSitemapRoute<T>(middleware)) {
+    let handler = revolutionRoute(pattern, middleware.handler);
+    if (middleware.routemap) {
+      const { routemap } = middleware;
+      Object.defineProperty(handler, "sitemapExtension", {
+	value(request: Request) {
+	  let generate = compile(pattern);
+	  return routemap(generate, request);
+	},
+      });
+    }
+    return handler;
+  } else {
+    return revolutionRoute(pattern, middleware);
+  }
+}
+
+function isSitemapRoute<T>(
+  o: Middleware<Request, T> | SitemapRoute<T>,
+): o is SitemapRoute<T> {
+  return !!(o as SitemapRoute<T>).handler;
+}
diff --git a/www/routes/app.html.tsx b/www/routes/app.html.tsx
index 31625bb4e..36e6a53cd 100644
--- a/www/routes/app.html.tsx
+++ b/www/routes/app.html.tsx
@@ -5,7 +5,6 @@ import { useAbsoluteUrl } from "../plugins/rebase.ts";
 import { Header } from "../components/header.tsx";
 import { Footer } from "../components/footer.tsx";
 
-
 export interface Options {
   title: string;
 }
@@ -20,7 +19,7 @@ export function* useAppHtml({
 }: Options): Operation<({ children, navLinks }: AppHtmlProps) => JSX.Element> {
   let homeURL = yield* useAbsoluteUrl("/");
   let twitterImageURL = yield* useAbsoluteUrl(
-    "/assets/images/meta-effection.png"
+    "/assets/images/meta-effection.png",
   );
 
   return ({ children, navLinks }) => (
@@ -68,7 +67,9 @@ export function* useAppHtml({
       </head>
       <body class="flex flex-col">
         <Header navLinks={navLinks} />
-        <main class="container max-w-screen-2xl mx-auto mb-auto">{children}</main>
+        <main class="container max-w-screen-2xl mx-auto mb-auto">
+          {children}
+        </main>
         <Footer />
       </body>
     </html>
diff --git a/www/routes/docs-route.tsx b/www/routes/docs-route.tsx
index 2e57ad306..1bfeb12c5 100644
--- a/www/routes/docs-route.tsx
+++ b/www/routes/docs-route.tsx
@@ -1,4 +1,4 @@
-import type { JSXHandler } from "revolution";
+import type { JSXElement } from "revolution";
 import type { Docs } from "../docs/docs.ts";
 import type { DocMeta } from "../docs/docs.ts";
 
@@ -17,171 +17,174 @@ import { IconGithub } from "../components/icons/github.tsx";
 import { IconDiscord } from "../components/icons/discord.tsx";
 import { ProjectSelect } from "../components/project-select.tsx";
 import { Navburger } from "../components/navburger.tsx";
-import { type HtmlElementNode } from "npm:@jsdevtools/rehype-toc@3.0.2";
-import { nodeTypes } from "npm:@mdx-js/mdx@2.3.0";
+import { SitemapRoute, RoutePath } from "../plugins/sitemap.ts";
 
-export function docsRoute(docs: Docs): JSXHandler {
-  return function* () {
-    let { id } = yield* useParams<{ id: string }>();
+export function docsRoute(docs: Docs): SitemapRoute<JSXElement> {
+  return {
+    *routemap(pathname) {
+      let paths: RoutePath[] = [];
+      for (let doc of yield* docs.all()) {
+        paths.push({
+          pathname: pathname({ id: doc.id }),
+        });
+      }
+      return paths;
+    },
+    *handler() {
+      let { id } = yield* useParams<{ id: string }>();
 
-    const doc = yield* docs.getDoc(id);
+      const doc = yield* docs.getDoc(id);
 
-    if (!doc) {
-      return yield* respondNotFound();
-    }
+      if (!doc) {
+        return yield* respondNotFound();
+      }
 
-    let { topics } = doc;
+      let { topics } = doc;
 
-    let AppHtml = yield* useAppHtml({ title: `${doc.title} | Effection` });
+      let AppHtml = yield* useAppHtml({ title: `${doc.title} | Effection` });
 
-    return (
-      <AppHtml
-        navLinks={[
-          <a href="/docs/installation">Guides</a>,
-          <a href="https://deno.land/x/effection/mod.ts">API</a>,
-          <a
-            class="flex flex-row"
-            href="https://github.com/thefrontside/effection"
-          >
-            <span class="pr-1 md:inline-flex">
-              <IconGithub />
-            </span>
-            <span class="hidden md:inline-flex">Github</span>
-          </a>,
-          <a class="flex flex-row" href="https://discord.gg/r6AvtnU">
-            <span class="pr-1 md:inline-flex">
-              <IconDiscord />
-            </span>
-            <span class="hidden md:inline-flex">Discord</span>
-          </a>,
-          <ProjectSelect classnames="sm:hidden shrink-0" />,
-          <>
-            <p class="flex flex-row md:hidden">
-              <label class="cursor-pointer" for="nav-toggle">
-                <Navburger />
-              </label>
-            </p>
-            <style media="all">
-              {`
+      return (
+        <AppHtml
+          navLinks={[
+            <a href="/docs/installation">Guides</a>,
+            <a href="https://deno.land/x/effection/mod.ts">API</a>,
+            <a
+              class="flex flex-row"
+              href="https://github.com/thefrontside/effection"
+            >
+              <span class="pr-1 md:inline-flex">
+                <IconGithub />
+              </span>
+              <span class="hidden md:inline-flex">
+                Github
+              </span>
+            </a>,
+            <a class="flex flex-row" href="https://discord.gg/r6AvtnU">
+              <span class="pr-1 md:inline-flex">
+                <IconDiscord />
+              </span>
+              <span class="hidden md:inline-flex">Discord</span>
+            </a>,
+            <ProjectSelect classnames="sm:hidden shrink-0" />,
+            <>
+              <p class="flex flex-row md:hidden">
+                <label class="cursor-pointer" for="nav-toggle">
+                  <Navburger />
+                </label>
+              </p>
+              <style media="all">
+                {`
       #nav-toggle:checked ~ aside#docbar {
-        display: none;
+	display: none;
       }
-          `}
-            </style>
-          </>,
-        ]}
-      >
-        <section class="min-h-0 mx-auto w-full justify-items-normal md:grid md:grid-cols-[225px_auto] lg:grid-cols-[225px_auto_200px] md:gap-4">
-          <input class="hidden" id="nav-toggle" type="checkbox" checked />
-          <aside
-            id="docbar"
-            class="fixed top-0 h-full w-full grid grid-cols-2 md:hidden"
-          >
-            <nav class="bg-white p-2 border-r-2 h-full pt-24 min-h-0 h-full overflow-auto">
-              {topics.map((topic) => (
-                <hgroup class="mb-2">
-                  <h3 class="text-lg">{topic.name}</h3>
-                  <menu class="text-gray-700">
-                    {topic.items.map((item) => (
-                      <li class="mt-1">
-                        {doc.id !== item.id
-                          ? (
-                            <a
-                              class="rounded px-4 block w-full py-2 hover:bg-gray-100"
-                              href={`/docs/${item.id}`}
-                            >
-                              {item.title}
-                            </a>
-                          )
-                          : (
-                            <a class="rounded px-4 block w-full py-2 bg-gray-100 cursor-default">
-                              {item.title}
-                            </a>
-                          )}
-                      </li>
-                    ))}
-                  </menu>
-                </hgroup>
-              ))}
-            </nav>
-            <label
-              for="nav-toggle"
-              class="h-full w-full bg-gray-500 opacity-50"
-            />
-          </aside>
-          <aside class="min-h-0 overflow-auto hidden md:block pt-2 top-24 sticky h-fit">
-            <nav class="pl-4">
-              {topics.map((topic) => (
-                <hgroup class="mb-2">
-                  <h3 class="text-lg">{topic.name}</h3>
-                  <menu class="text-gray-700">
-                    {topic.items.map((item) => (
-                      <li class="mt-1">
-                        {doc.id !== item.id
-                          ? (
-                            <a
-                              class="rounded px-4 block w-full py-2 hover:bg-gray-100"
-                              href={`/docs/${item.id}`}
-                            >
-                              {item.title}
-                            </a>
-                          )
-                          : (
-                            <a class="rounded px-4 block w-full py-2 bg-gray-100 cursor-default">
-                              {item.title}
-                            </a>
-                          )}
-                      </li>
-                    ))}
-                  </menu>
-                </hgroup>
-              ))}
-            </nav>
-          </aside>
-          <Transform fn={liftTOC}>
-            <article class="prose max-w-full px-6 py-2">
-              <h1>{doc.title}</h1>
-              <Rehype
-                plugins={[
-                  rehypeSlug,
-                  [
-                    rehypeAutolinkHeadings,
-                    {
+	  `}
+              </style>
+            </>,
+          ]}
+        >
+          <section class="min-h-0 mx-auto w-full justify-items-normal md:grid md:grid-cols-[225px_auto] lg:grid-cols-[225px_auto_200px] md:gap-4">
+            <input class="hidden" id="nav-toggle" type="checkbox" checked />
+            <aside
+              id="docbar"
+              class="fixed top-0 h-full w-full grid grid-cols-2 md:hidden"
+            >
+              <nav class="bg-white p-2 border-r-2 h-full pt-24 min-h-0 h-full overflow-auto">
+                {topics.map((topic) => (
+                  <hgroup class="mb-2">
+                    <h3 class="text-lg">{topic.name}</h3>
+                    <menu class="text-gray-700">
+                      {topic.items.map((item) => (
+                        <li class="mt-1">
+                          {doc.id !== item.id
+                            ? (
+                              <a
+                                class="rounded px-4 block w-full py-2 hover:bg-gray-100"
+                                href={`/docs/${item.id}`}
+                              >
+                                {item.title}
+                              </a>
+                            )
+                            : (
+                              <a class="rounded px-4 block w-full py-2 bg-gray-100 cursor-default">
+                                {item.title}
+                              </a>
+                            )}
+                        </li>
+                      ))}
+                    </menu>
+                  </hgroup>
+                ))}
+              </nav>
+              <label
+                for="nav-toggle"
+                class="h-full w-full bg-gray-500 opacity-50"
+              />
+            </aside>
+            <aside class="min-h-0 overflow-auto hidden md:block pt-2 top-24 sticky h-fit">
+              <nav class="pl-4">
+                {topics.map((topic) => (
+                  <hgroup class="mb-2">
+                    <h3 class="text-lg">{topic.name}</h3>
+                    <menu class="text-gray-700">
+                      {topic.items.map((item) => (
+                        <li class="mt-1">
+                          {doc.id !== item.id
+                            ? (
+                              <a
+                                class="rounded px-4 block w-full py-2 hover:bg-gray-100"
+                                href={`/docs/${item.id}`}
+                              >
+                                {item.title}
+                              </a>
+                            )
+                            : (
+                              <a class="rounded px-4 block w-full py-2 bg-gray-100 cursor-default">
+                                {item.title}
+                              </a>
+                            )}
+                        </li>
+                      ))}
+                    </menu>
+                  </hgroup>
+                ))}
+              </nav>
+            </aside>
+            <Transform fn={liftTOC}>
+              <article class="prose max-w-full px-6 py-2">
+                <h1>{doc.title}</h1>
+                <Rehype
+                  plugins={[
+                    rehypeSlug,
+                    [rehypeAutolinkHeadings, {
                       behavior: "append",
                       properties: {
                         className:
                           "opacity-0 group-hover:opacity-100 after:content-['#'] after:ml-1.5",
                       },
-                    },
-                  ],
-                  [
-                    rehypeAddClasses,
-                    {
+                    }],
+                    [rehypeAddClasses, {
                       "h1[id],h2[id],h3[id],h4[id],h5[id],h6[id]": "group",
-                      pre: "grid",
-                    },
-                  ],
-                  [
-                    rehypeToc,
-                    {
+                      "pre": "grid",
+                    }],
+                    [rehypeToc, {
                       cssClasses: {
                         toc:
-                          "text-sm tracking-wide leading-loose lg:block relative pt-2",
+                          "hidden text-sm font-light tracking-wide leading-loose lg:block relative pt-2",
+                        list: "fixed w-[200px]",
                         link: "hover:underline hover:underline-offset-2",
                       },
-                      customizeTOC,
-                    },
-                  ],
-                ]}
-              >
-                <doc.MDXContent />
-              </Rehype>
-              <NextPrevLinks doc={doc} />
-            </article>
-          </Transform>
-        </section>
-      </AppHtml>
-    );
+                    }],
+                  ]}
+                >
+                  <doc.MDXContent />
+                </Rehype>
+                <NextPrevLinks doc={doc} />
+              </article>
+            </Transform>
+          </section>
+        </AppHtml>
+      );
+    },
   };
 }
 
diff --git a/www/routes/index-route.tsx b/www/routes/index-route.tsx
index 89ce0747e..7e5e50d5f 100644
--- a/www/routes/index-route.tsx
+++ b/www/routes/index-route.tsx
@@ -1,236 +1,258 @@
-import type { JSXChild, JSXHandler } from "revolution";
+import type { JSXChild, JSXElement } from "revolution";
 
 import { useAppHtml } from "./app.html.tsx";
-import { Footer } from "../components/footer.tsx";
 import { IconTSLogo } from "../components/icons/typescript.tsx";
 import { IconCartouche } from "../components/icons/cartouche.tsx";
 import { IconGithub } from "../components/icons/github.tsx";
 import { IconDiscord } from "../components/icons/discord.tsx";
-import { ProjectSelect } from '../components/project-select.tsx';
+import { ProjectSelect } from "../components/project-select.tsx";
 import { Navburger } from "../components/navburger.tsx";
+import { SitemapRoute } from "../plugins/sitemap.ts";
 
-export function indexRoute(): JSXHandler {
-  return function* () {
-    let AppHtml = yield* useAppHtml({ title: `Effection` });
-    let announcementUrl = "https://frontside.com/blog/2023-12-18-announcing-effection-v3/";
+export function indexRoute(): SitemapRoute<JSXElement> {
+  return {
+    *routemap(generate) {
+      return [{
+        pathname: generate(),
+      }];
+    },
+    handler: function* () {
+      let AppHtml = yield* useAppHtml({ title: `Effection` });
+      let announcementUrl =
+        "https://frontside.com/blog/2023-12-18-announcing-effection-v3/";
 
-    return (
-      <AppHtml navLinks={[
-        <a href="/docs/installation">Guides</a>,
-        <a href="https://deno.land/x/effection/mod.ts">API</a>,
-        <a class="flex flex-row" href="https://github.com/thefrontside/effection">
-          <span class="pr-1 md:inline-flex">
-            <IconGithub />
-          </span>
-          <span class="hidden md:inline-flex">
-            Github
-          </span>
-        </a>,
-        <a class="flex flex-row" href="https://discord.gg/r6AvtnU">
-          <span class="pr-1 md:inline-flex">
-            <IconDiscord />
-          </span>
-          <span class="hidden md:inline-flex">Discord</span>
-        </a>,
-        <ProjectSelect classnames="sm:hidden shrink-0" />,
-        <>
-          <p class="flex flex-row invisible">
-            <label class="cursor-pointer" for="nav-toggle">
-              <Navburger />
-            </label>
-          </p>
-          <style media="all">
-            {`
+      return (
+        <AppHtml
+          navLinks={[
+            <a href="/docs/installation">Guides</a>,
+            <a href="https://deno.land/x/effection/mod.ts">API</a>,
+            <a
+              class="flex flex-row"
+              href="https://github.com/thefrontside/effection"
+            >
+              <span class="pr-1 md:inline-flex">
+                <IconGithub />
+              </span>
+              <span class="hidden md:inline-flex">
+                Github
+              </span>
+            </a>,
+            <a class="flex flex-row" href="https://discord.gg/r6AvtnU">
+              <span class="pr-1 md:inline-flex">
+                <IconDiscord />
+              </span>
+              <span class="hidden md:inline-flex">Discord</span>
+            </a>,
+            <ProjectSelect classnames="sm:hidden shrink-0" />,
+            <>
+              <p class="flex flex-row invisible">
+                <label class="cursor-pointer" for="nav-toggle">
+                  <Navburger />
+                </label>
+              </p>
+              <style media="all">
+                {`
       #nav-toggle:checked ~ aside#docbar {
         display: none;
       }
             `}
-            </style>
-          </>
-      ]}>
-        <>
-          <article class="p-4 md:px-12 mb-16">
-            <section class="grid grid-cols-1 md:grid-cols-3 md:gap-4">
-              <hgroup class="text-center col-span-1 md:col-span-3 my-8">
-                <img
-                  class="inline max-w-[30%] mb-4"
-                  alt="Effection Logo"
-                  src="/assets/images/icon-effection.svg"
-                  width={144}
-                  height={144}
-                />
-                <h1 class="text-4xl font-bold leading-7">Effection</h1>
-                <p class="text-2xl py-4 mb-6">
-                  Structured Concurrency and Effects for JavaScript
-                </p>
-                <div class="grid grid-cols-6 gap-y-2 md:gap-y-4 gap-x-2">
-                  <a
-                    class="col-span-6 md:col-span-2 md:col-start-2 lg:col-span-1 lg:col-start-3 p-2 mr-2 text-md text-white w-full border-blue-900 border-solid border-2 rounded bg-blue-900 hover:bg-blue-800 transition-colors md:px-4"
-                    href="/docs/installation"
-                  >
-                    Get Started
-                  </a>
-                  <a
-                    class="col-span-6 md:col-span-2 p-2 lg:col-span-1 text-md text-blue-900 bg-white hover:bg-blue-100 transition border-blue-900 border-solid border-2 w-full rounded md:px-4"
-                    href="https://deno.land/x/effection/mod.ts"
-                  >
-                    API Reference
-                  </a>
-                  <p class="col-span-6 text-center">
-                    <span class="inline-block bg-sky-100 text-blue-900 rounded py-1 px-4 w-fit border border-sky-200">
-                      December 18, 2023 - We're proud to{" "}
-                      <a
-                        class="underline underline-offset-4"
-                        href={announcementUrl}
-                      >
-                        announce the release of Effection 3.0.
-                      </a>
-                    </span>
+              </style>
+            </>,
+          ]}
+        >
+          <>
+            <article class="p-4 md:px-12 mb-16">
+              <section class="grid grid-cols-1 md:grid-cols-3 md:gap-4">
+                <hgroup class="text-center col-span-1 md:col-span-3 my-8">
+                  <img
+                    class="inline max-w-[30%] mb-4"
+                    alt="Effection Logo"
+                    src="/assets/images/icon-effection.svg"
+                    width={144}
+                    height={144}
+                  />
+                  <h1 class="text-4xl font-bold leading-7">Effection</h1>
+                  <p class="text-2xl py-4 mb-6">
+                    Structured Concurrency and Effects for JavaScript
                   </p>
-                </div>
-              </hgroup>
-            </section>
-
-            <section class="my-20">
-              <hgroup class="mx-auto max-w-2xl lg:text-center">
-                <h2 class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
-                  Latest video
-                </h2>
-                <p class="mt-6 text-lg leading-8 text-gray-600 mb-2">
-                  Watch Charles Lowell, the creator of Effection, explain
-                  Effection and answer frequenty asked questions.
-                </p>
-                <iframe
-                  class="mx-auto w-full aspect-video pr-0.5"
-                  src="https://www.youtube.com/embed/lJDgpxRw5WA?si=rZuOYa_UWDdP1G_V"
-                  title="YouTube video player"
-                  frameborder="0"
-                  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-                  allowfullscreen
-                ></iframe>
-              </hgroup>
-            </section>
+                  <div class="grid grid-cols-6 gap-y-2 md:gap-y-4 gap-x-2">
+                    <a
+                      class="col-span-6 md:col-span-2 md:col-start-2 lg:col-span-1 lg:col-start-3 p-2 mr-2 text-md text-white w-full border-blue-900 border-solid border-2 rounded bg-blue-900 hover:bg-blue-800 transition-colors md:px-4"
+                      href="/docs/installation"
+                    >
+                      Get Started
+                    </a>
+                    <a
+                      class="col-span-6 md:col-span-2 p-2 lg:col-span-1 text-md text-blue-900 bg-white hover:bg-blue-100 transition border-blue-900 border-solid border-2 w-full rounded md:px-4"
+                      href="https://deno.land/x/effection/mod.ts"
+                    >
+                      API Reference
+                    </a>
+                    <p class="col-span-6 text-center">
+                      <span class="inline-block bg-sky-100 text-blue-900 rounded py-1 px-4 w-fit border border-sky-200">
+                        December 18, 2023 - We're proud to{" "}
+                        <a
+                          class="underline underline-offset-4"
+                          href={announcementUrl}
+                        >
+                          announce the release of Effection 3.0.
+                        </a>
+                      </span>
+                    </p>
+                  </div>
+                </hgroup>
+              </section>
 
-            <section class="my-20">
-              <hgroup class="mx-auto max-w-2xl lg:text-center">
-                <h2 class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
-                  Stop worrying about asynchrony
-                </h2>
-                <p class="mt-6 text-lg leading-8 text-gray-600">
-                  Effection gives you control over asyncronous operations with{" "}
-                  <a
-                    class="underline underline-offset-4"
-                    href="/docs/thinking-in-effection"
+              <section class="my-20">
+                <hgroup class="mx-auto max-w-2xl lg:text-center">
+                  <h2 class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
+                    Latest video
+                  </h2>
+                  <p class="mt-6 text-lg leading-8 text-gray-600 mb-2">
+                    Watch Charles Lowell, the creator of Effection, explain
+                    Effection and answer frequenty asked questions.
+                  </p>
+                  <iframe
+                    class="mx-auto w-full aspect-video pr-0.5"
+                    src="https://www.youtube.com/embed/lJDgpxRw5WA?si=rZuOYa_UWDdP1G_V"
+                    title="YouTube video player"
+		    //@ts-expect-error TODO: add frameborder attribute to JSX
+                    frameborder="0"
+                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                    allowfullscreen
                   >
-                    Structured Concurrency guarantees
-                  </a>
-                  . We ensure that all asyncronous operations are well behaved
-                  so you can focus on using async instead of managing it.
-                </p>
-              </hgroup>
-              <div class="mx-auto mt-8 max-w-2xl sm:mt-12 lg:mt-16 lg:max-w-4xl md:grid md:grid-cols-2 md:gap-y-4">
-                <Feature icon={"🛡️"} summary={"Leak proof"}>
-                  Effection code cleans up after itself, and that means never
-                  having to remember to manually close a resource or detach a
-                  listener.
-                </Feature>
-
-                <Feature icon={"🖐️"} summary="Halt any operation">
-                  An Effection operation can be shut down at any moment which
-                  will not only stop it completely but also stop any other
-                  operations that it started.
-                </Feature>
-
-                <Feature icon={"🔒"} summary="Race condition free">
-                  Unlike Promises and async/await, Effection is fundamentally
-                  synchronous in nature, which means you have full control over
-                  the event loop and operations requiring synchronous setup
-                  remain race condition free.
-                </Feature>
+                  </iframe>
+                </hgroup>
+              </section>
 
-                <Feature icon={"🎹"} summary="Seamless composition">
-                  Since all Effection code is well behaved, it clicks together
-                  easily, and there are no nasty surprises when fitting
-                  different pieces together.
-                </Feature>
-              </div>
-            </section>
-
-            <section class="mt-20">
-              <hgroup class="mx-auto max-w-2xl lg:text-center">
-                <h2 class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
-                  It's just JavaScript
-                </h2>
-                <p class="mt-6 text-lg leading-8 text-gray-600">
-                  Effection is a light-weight alternative to{" "}
-                  <code>async/await</code> with Structured Concurrency
-                  guarantees. It only requires adding a few new JavaScript
-                  techniques to the knowledge you already have.
-                </p>
-              </hgroup>
-              <div class="mx-auto mt-8 max-w-2xl sm:mt-12 lg:mt-16 lg:max-w-4xl md:grid md:grid-cols-2 md:gap-y-4">
-                <Feature icon={"😎"} summary="Use familiar language constructs">
-                  <>
-                    Use <code>let</code>, <code>const</code>, <code>for</code>,{" "}
-                    <code>while</code>, <code>switch/case</code> and{" "}
-                    <code>try/catch/finally</code> to write asyncrous
-                    operations. They work as you'd expect.
-                  </>
-                </Feature>
-                <Feature
-                  icon={<IconTSLogo />}
-                  summary="First-class TypeScript Support"
-                >
-                  <>
-                    Use in TypeScript or JavaScript projects without modifying
-                    your build setup. Effection operations can be used and
-                    distributed in pure ESM code.
-                  </>
-                </Feature>
-                <Feature icon={"😵‍💫"} summary="No esoteric APIs">
-                  <>
-                    Small API focused excusively on what you need to gain
-                    Structured Concurrency guarantees in JavaScript and nothing
-                    else.
-                  </>
-                </Feature>
-                <Feature
-                  icon={<IconCartouche />}
-                  summary="Async/Await/Promise alternatives"
-                  iconSize="h-14 w-14"
-                >
-                  <>
-                    For every Async/Await/Promise API we provide Structured
-                    Concurrency compliant Effection alternative. Checkout our{" "}
+              <section class="my-20">
+                <hgroup class="mx-auto max-w-2xl lg:text-center">
+                  <h2 class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
+                    Stop worrying about asynchrony
+                  </h2>
+                  <p class="mt-6 text-lg leading-8 text-gray-600">
+                    Effection gives you control over asyncronous operations with
+                    {" "}
                     <a
                       class="underline underline-offset-4"
-                      href="/docs/async-rosetta-stone"
+                      href="/docs/thinking-in-effection"
                     >
-                      Async Rosetta Stone
-                    </a>{" "}
-                    for translations.
-                  </>
-                </Feature>
-                <Feature icon={"💪"} summary="Small but powerful">
-                  <>
-                    Everything you need comes in one dependency-free package. At
-                    less than 5KB minified and gzipped, Effection can be dropped
-                    into any project.
-                  </>
-                </Feature>
-                <Feature icon={"💎"} summary="No build step">
-                  <>
-                    Use in TypeScript or JavaScript projects without modifying
-                    your build setup. Effection operations can be used and
-                    distributed in pure ESM code.
-                  </>
-                </Feature>
-              </div>
-            </section>
-          </article>
-        </>
-      </AppHtml>
-    );
+                      Structured Concurrency guarantees
+                    </a>
+                    . We ensure that all asyncronous operations are well behaved
+                    so you can focus on using async instead of managing it.
+                  </p>
+                </hgroup>
+                <div class="mx-auto mt-8 max-w-2xl sm:mt-12 lg:mt-16 lg:max-w-4xl md:grid md:grid-cols-2 md:gap-y-4">
+                  <Feature icon={"🛡️"} summary={"Leak proof"}>
+                    Effection code cleans up after itself, and that means never
+                    having to remember to manually close a resource or detach a
+                    listener.
+                  </Feature>
+
+                  <Feature icon={"🖐️"} summary="Halt any operation">
+                    An Effection operation can be shut down at any moment which
+                    will not only stop it completely but also stop any other
+                    operations that it started.
+                  </Feature>
+
+                  <Feature icon={"🔒"} summary="Race condition free">
+                    Unlike Promises and async/await, Effection is fundamentally
+                    synchronous in nature, which means you have full control
+                    over the event loop and operations requiring synchronous
+                    setup remain race condition free.
+                  </Feature>
+
+                  <Feature icon={"🎹"} summary="Seamless composition">
+                    Since all Effection code is well behaved, it clicks together
+                    easily, and there are no nasty surprises when fitting
+                    different pieces together.
+                  </Feature>
+                </div>
+              </section>
+
+              <section class="mt-20">
+                <hgroup class="mx-auto max-w-2xl lg:text-center">
+                  <h2 class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
+                    It's just JavaScript
+                  </h2>
+                  <p class="mt-6 text-lg leading-8 text-gray-600">
+                    Effection is a light-weight alternative to{" "}
+                    <code>async/await</code>{" "}
+                    with Structured Concurrency guarantees. It only requires
+                    adding a few new JavaScript techniques to the knowledge you
+                    already have.
+                  </p>
+                </hgroup>
+                <div class="mx-auto mt-8 max-w-2xl sm:mt-12 lg:mt-16 lg:max-w-4xl md:grid md:grid-cols-2 md:gap-y-4">
+                  <Feature
+                    icon={"😎"}
+                    summary="Use familiar language constructs"
+                  >
+                    <>
+                      Use <code>let</code>, <code>const</code>,{" "}
+                      <code>for</code>, <code>while</code>,{" "}
+                      <code>switch/case</code> and{" "}
+                      <code>try/catch/finally</code>{" "}
+                      to write asyncrous operations. They work as you'd expect.
+                    </>
+                  </Feature>
+                  <Feature
+                    icon={<IconTSLogo />}
+                    summary="First-class TypeScript Support"
+                  >
+                    <>
+                      Use in TypeScript or JavaScript projects without modifying
+                      your build setup. Effection operations can be used and
+                      distributed in pure ESM code.
+                    </>
+                  </Feature>
+                  <Feature icon={"😵‍💫"} summary="No esoteric APIs">
+                    <>
+                      Small API focused excusively on what you need to gain
+                      Structured Concurrency guarantees in JavaScript and
+                      nothing else.
+                    </>
+                  </Feature>
+                  <Feature
+                    icon={<IconCartouche />}
+                    summary="Async/Await/Promise alternatives"
+                    iconSize="h-14 w-14"
+                  >
+                    <>
+                      For every Async/Await/Promise API we provide Structured
+                      Concurrency compliant Effection alternative. Checkout our
+                      {" "}
+                      <a
+                        class="underline underline-offset-4"
+                        href="/docs/async-rosetta-stone"
+                      >
+                        Async Rosetta Stone
+                      </a>{" "}
+                      for translations.
+                    </>
+                  </Feature>
+                  <Feature icon={"💪"} summary="Small but powerful">
+                    <>
+                      Everything you need comes in one dependency-free package.
+                      At less than 5KB minified and gzipped, Effection can be
+                      dropped into any project.
+                    </>
+                  </Feature>
+                  <Feature icon={"💎"} summary="No build step">
+                    <>
+                      Use in TypeScript or JavaScript projects without modifying
+                      your build setup. Effection operations can be used and
+                      distributed in pure ESM code.
+                    </>
+                  </Feature>
+                </div>
+              </section>
+            </article>
+          </>
+        </AppHtml>
+      );
+    },
   };
 }
 
diff --git a/www/routes/v2docs-route.tsx b/www/routes/v2docs-route.tsx
index 48a9af136..f727dff04 100644
--- a/www/routes/v2docs-route.tsx
+++ b/www/routes/v2docs-route.tsx
@@ -1,29 +1,107 @@
-import type { HTTPMiddleware } from "revolution";
+import type { Middleware } from "revolution";
 import type { V2Docs } from "../docs/v2-docs.ts";
 
 import { call } from "effection";
 import { concat, route } from "revolution";
 import { serveTar } from "./serve-tar.ts";
+import { RoutePath, SitemapRoute } from "../plugins/sitemap.ts";
 
-export function v2docsRoute(v2docs: V2Docs): HTTPMiddleware {
+export function v2docsRoute(
+  v2docs: V2Docs,
+): SitemapRoute<Response> {
   let { apidocs, website } = v2docs;
 
-  return concat(
-    route("/V2/api(.*)", function* (request) {
-      return yield* call(serveTar(request, {
-        tarRoot: "api/v2",
-        urlRoot: "V2/api",
-        entries: yield* apidocs,
-      }));
-    }),
-    route("/V2(.*)", function* (request) {
-      return yield* call(serveTar(request, {
-        tarRoot: "site",
-        urlRoot: "V2",
-        entries: yield* request.headers.has("X-Base-Url")
+  return {
+    *routemap(pathname, request) {
+      let paths: RoutePath[] = [];
+
+      let entries = {
+        website:
+          yield* (request.headers.has("X-Base-Url")
+            ? website.prod
+            : website.local),
+        apidocs: yield* apidocs,
+      };
+
+      for (let entry of entries.website.values()) {
+        if (entry.type === "file" && entry.fileName.endsWith("index.html")) {
+          let filename = entry.fileName.replace(/\/index.html$/, "").replace(
+            /^site/,
+            "",
+          );
+          paths.push({
+            pathname: pathname({ "0": filename }),
+          });
+        }
+      }
+
+      for (let entry of entries.apidocs.values()) {
+        if (entry.type === "file" && entry.fileName.endsWith(".html")) {
+          let filename = entry.fileName.replace(/^api\/v2/, "/api");
+          paths.push({
+            pathname: pathname({ "0": filename }),
+          });
+        }
+      }
+
+      paths.push({
+        pathname: pathname({ "0": "/dynamic-resources" }),
+      });
+
+      return paths;
+    },
+    handler: concat(
+      route("/V2/dynamic-resources", function* (request) {
+        let archive = yield* (request.headers.has("X-Base-Url")
           ? website.prod
-          : website.local,
-      }));
-    }),
-  );
+          : website.local);
+
+        let resources = [...archive.values()].flatMap(({ fileName }) => {
+          if (fileName.endsWith(".js") || fileName.endsWith(".svg")) {
+            return [fileName.replace(/^site\//, "")];
+          } else {
+            return [];
+          }
+        });
+
+        return (
+          <html>
+            <head>
+              {resources.map((path) => (
+                <link rel="dynamic-resource" href={path} />
+              ))}
+            </head>
+            <body>
+              Dynamic Resources
+              <ul>
+                {resources.map((path) => (
+                  <li>
+                    <a href={path}>{path}</a>
+                  </li>
+                ))}
+              </ul>
+            </body>
+          </html>
+        );
+      }) as unknown as Middleware<Request, Response>,
+      route("/V2/api(.*)", function* (request) {
+        return yield* call(serveTar(request, {
+          tarRoot: "api/v2",
+          urlRoot: "V2/api",
+          entries: yield* apidocs,
+        }));
+      }),
+      route("/V2(.*)", function* (request) {
+        let entries = yield* (request.headers.has("X-Base-Url")
+          ? website.prod
+          : website.local);
+
+        return yield* call(serveTar(request, {
+          tarRoot: "site",
+          urlRoot: "V2",
+          entries,
+        }));
+      }),
+    ),
+  };
 }