diff --git a/package-lock.json b/package-lock.json
index 5ada461..82d290f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,7 +21,7 @@
         "@sveltejs/adapter-auto": "3.x",
         "@sveltejs/adapter-static": "3.x",
         "@sveltejs/kit": "2.x",
-        "@sveltejs/vite-plugin-svelte": "3.x",
+        "@sveltejs/vite-plugin-svelte": "4.x",
         "@types/he": "1.2.x",
         "@types/node": "22.x",
         "autoprefixer": "10.x",
@@ -1318,59 +1318,45 @@
       }
     },
     "node_modules/@sveltejs/vite-plugin-svelte": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-3.1.2.tgz",
-      "integrity": "sha512-Txsm1tJvtiYeLUVRNqxZGKR/mI+CzuIQuc2gn+YCs9rMTowpNZ2Nqt53JdL8KF9bLhAf2ruR/dr9eZCwdTriRA==",
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-4.0.4.tgz",
+      "integrity": "sha512-0ba1RQ/PHen5FGpdSrW7Y3fAMQjrXantECALeOiOdBdzR5+5vPP6HVZRLmZaQL+W8m++o+haIAKq5qT+MiZ7VA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@sveltejs/vite-plugin-svelte-inspector": "^2.1.0",
-        "debug": "^4.3.4",
+        "@sveltejs/vite-plugin-svelte-inspector": "^3.0.0-next.0||^3.0.0",
+        "debug": "^4.3.7",
         "deepmerge": "^4.3.1",
         "kleur": "^4.1.5",
-        "magic-string": "^0.30.10",
-        "svelte-hmr": "^0.16.0",
-        "vitefu": "^0.2.5"
+        "magic-string": "^0.30.12",
+        "vitefu": "^1.0.3"
       },
       "engines": {
-        "node": "^18.0.0 || >=20"
+        "node": "^18.0.0 || ^20.0.0 || >=22"
       },
       "peerDependencies": {
-        "svelte": "^4.0.0 || ^5.0.0-next.0",
+        "svelte": "^5.0.0-next.96 || ^5.0.0",
         "vite": "^5.0.0"
       }
     },
-    "node_modules/@sveltejs/vite-plugin-svelte/node_modules/@sveltejs/vite-plugin-svelte-inspector": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte-inspector/-/vite-plugin-svelte-inspector-2.1.0.tgz",
-      "integrity": "sha512-9QX28IymvBlSCqsCll5t0kQVxipsfhFFL+L2t3nTWfXnddYwxBuAEtTtlaVQpRz9c37BhJjltSeY4AJSC03SSg==",
+    "node_modules/@sveltejs/vite-plugin-svelte-inspector": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte-inspector/-/vite-plugin-svelte-inspector-3.0.1.tgz",
+      "integrity": "sha512-2CKypmj1sM4GE7HjllT7UKmo4Q6L5xFRd7VMGEWhYnZ+wc6AUVU01IBd7yUi6WnFndEwWoMNOd6e8UjoN0nbvQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "debug": "^4.3.4"
+        "debug": "^4.3.7"
       },
       "engines": {
-        "node": "^18.0.0 || >=20"
+        "node": "^18.0.0 || ^20.0.0 || >=22"
       },
       "peerDependencies": {
-        "@sveltejs/vite-plugin-svelte": "^3.0.0",
-        "svelte": "^4.0.0 || ^5.0.0-next.0",
+        "@sveltejs/vite-plugin-svelte": "^4.0.0-next.0||^4.0.0",
+        "svelte": "^5.0.0-next.96 || ^5.0.0",
         "vite": "^5.0.0"
       }
     },
-    "node_modules/@sveltejs/vite-plugin-svelte/node_modules/svelte-hmr": {
-      "version": "0.16.0",
-      "resolved": "https://registry.npmjs.org/svelte-hmr/-/svelte-hmr-0.16.0.tgz",
-      "integrity": "sha512-Gyc7cOS3VJzLlfj7wKS0ZnzDVdv3Pn2IuVeJPk9m2skfhcu5bq3wtIZyQGggr7/Iim5rH5cncyQft/kRLupcnA==",
-      "dev": true,
-      "license": "ISC",
-      "engines": {
-        "node": "^12.20 || ^14.13.1 || >= 16"
-      },
-      "peerDependencies": {
-        "svelte": "^3.19.0 || ^4.0.0"
-      }
-    },
     "node_modules/@tailwindcss/forms": {
       "version": "0.5.9",
       "resolved": "https://registry.npmjs.org/@tailwindcss/forms/-/forms-0.5.9.tgz",
@@ -5481,13 +5467,17 @@
       }
     },
     "node_modules/vitefu": {
-      "version": "0.2.5",
-      "resolved": "https://registry.npmjs.org/vitefu/-/vitefu-0.2.5.tgz",
-      "integrity": "sha512-SgHtMLoqaeeGnd2evZ849ZbACbnwQCIwRH57t18FxcXoZop0uQu0uzlIhJBlF/eWVzuce0sHeqPcDo+evVcg8Q==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/vitefu/-/vitefu-1.0.4.tgz",
+      "integrity": "sha512-y6zEE3PQf6uu/Mt6DTJ9ih+kyJLr4XcSgHR2zUkM8SWDhuixEJxfJ6CZGMHh1Ec3vPLoEA0IHU5oWzVqw8ulow==",
       "dev": true,
       "license": "MIT",
+      "workspaces": [
+        "tests/deps/*",
+        "tests/projects/*"
+      ],
       "peerDependencies": {
-        "vite": "^3.0.0 || ^4.0.0 || ^5.0.0"
+        "vite": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0"
       },
       "peerDependenciesMeta": {
         "vite": {
diff --git a/package.json b/package.json
index 0b6f1ee..07b9d44 100644
--- a/package.json
+++ b/package.json
@@ -26,7 +26,7 @@
     "@sveltejs/adapter-auto": "3.x",
     "@sveltejs/adapter-static": "3.x",
     "@sveltejs/kit": "2.x",
-    "@sveltejs/vite-plugin-svelte": "3.x",
+    "@sveltejs/vite-plugin-svelte": "4.x",
     "@types/he": "1.2.x",
     "@types/node": "22.x",
     "autoprefixer": "10.x",
diff --git a/src/app.d.ts b/src/app.d.ts
index 899c7e8..3cbf17e 100644
--- a/src/app.d.ts
+++ b/src/app.d.ts
@@ -4,7 +4,11 @@ declare global {
   namespace App {
     // interface Error {}
     // interface Locals {}
-    // interface PageData {}
+    interface PageData {
+      ndk?: NDK;
+      parser?: Pharos;
+      waitable?: Promise<any>;
+    }
     // interface Platform {}
   }
 }
diff --git a/src/lib/components/Article.svelte b/src/lib/components/Article.svelte
index ad11409..df3d165 100644
--- a/src/lib/components/Article.svelte
+++ b/src/lib/components/Article.svelte
@@ -1,28 +1,18 @@
-<script lang="ts">
-  import { ndk } from '$lib/ndk';
-  import type { NDKEvent } from '@nostr-dev-kit/ndk';
-  import { page } from '$app/stores';
-  import { Alert, Button, Heading, P, Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, Skeleton, TextPlaceholder, Tooltip, xs } from 'flowbite-svelte';
+<script lang='ts'>
+  import { Button, Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, Skeleton, TextPlaceholder, Tooltip } from 'flowbite-svelte';
   import { onMount } from 'svelte';
-  import { BookOutline, ExclamationCircleOutline } from 'flowbite-svelte-icons';
-  import Pharos, { parser } from '$lib/parser';
+  import { BookOutline } from 'flowbite-svelte-icons';
   import Preview from './Preview.svelte';
-  import { goto, invalidateAll } from '$app/navigation';
+  import { pharosInstance } from '$lib/parser';
+  import { page } from '$app/state';
 
-  export let index: NDKEvent | null | undefined;
+  let { rootId }: { rootId: string } = $props();
 
-  $parser ??= new Pharos($ndk);
-
-  $: activeHash = $page.url.hash;
-
-  const getContentRoot = async (index?: NDKEvent | null | undefined): Promise<string | null> => {
-    if (!index) {
-      return null;
-    }
+  if (rootId !== $pharosInstance.getRootIndexId()) {
+    console.error('Root ID does not match parser root index ID');
+  }
 
-    await $parser.fetch(index);
-    return $parser.getRootIndexId();
-  };
+  let activeHash = $state(page.url.hash);
 
   function normalizeHashPath(str: string): string {
     return str
@@ -95,74 +85,40 @@
   });
 </script>
 
-{#await getContentRoot(index)}
-  <Sidebar class='sidebar-leather fixed top-20 left-0 px-4 w-60'>
+{#if showTocButton && !showToc}
+  <Button
+    class='btn-leather fixed top-20 left-4 h-6 w-6'
+    outline={true}
+    on:click={ev => {
+      showToc = true;
+      ev.stopPropagation();
+    }}
+  >
+    <BookOutline />
+  </Button>
+  <Tooltip>
+    Show Table of Contents
+  </Tooltip>
+{/if}
+<!-- TODO: Get TOC from parser. -->
+<!-- {#if showToc}
+  <Sidebar class='sidebar-leather fixed top-20 left-0 px-4 w-60' {activeHash}>
     <SidebarWrapper>
-      <Skeleton/>
+      <SidebarGroup class='sidebar-group-leather overflow-y-scroll'>
+        {#each events as event}
+          <SidebarItem
+            class='sidebar-item-leather'
+            label={event.getMatchingTags('title')[0][1]}
+            href={`${$page.url.pathname}#${normalizeHashPath(event.getMatchingTags('title')[0][1])}`}
+          />
+        {/each}
+      </SidebarGroup>
     </SidebarWrapper>
   </Sidebar>
-  <TextPlaceholder divClass='max-w-2xl'/>
-{:then rootId}
-  {#if rootId}
-    {#if showTocButton && !showToc}
-      <Button
-        class='btn-leather fixed top-20 left-4 h-6 w-6'
-        outline={true}
-        on:click={ev => {
-          showToc = true;
-          ev.stopPropagation();
-        }}
-      >
-        <BookOutline />
-      </Button>
-      <Tooltip>
-        Show Table of Contents
-      </Tooltip>
-    {/if}
-    <!-- TODO: Get TOC from parser. -->
-    <!-- {#if showToc}
-      <Sidebar class='sidebar-leather fixed top-20 left-0 px-4 w-60' {activeHash}>
-        <SidebarWrapper>
-          <SidebarGroup class='sidebar-group-leather overflow-y-scroll'>
-            {#each events as event}
-              <SidebarItem
-                class='sidebar-item-leather'
-                label={event.getMatchingTags('title')[0][1]}
-                href={`${$page.url.pathname}#${normalizeHashPath(event.getMatchingTags('title')[0][1])}`}
-              />
-            {/each}
-          </SidebarGroup>
-        </SidebarWrapper>
-      </Sidebar>
-    {/if} -->
-    <div class='flex flex-col space-y-4 max-w-2xl'>
-      <Preview rootId={rootId} />
-    </div>
-  {/if}
-{:catch err}
-  <Alert>
-    <div class='flex items-center space-x-2'>
-      <ExclamationCircleOutline class='w-6 h-6' />
-      <span class='text-lg font-medium'>
-        Failed to load publication.
-      </span>
-    </div>
-    <P size='sm'>
-      Alexandria failed to find one or more of the events comprising this publication.
-    </P>
-    <P size='xs'>
-      {err.message}
-    </P>
-    <div class='flex space-x-2'>
-      <Button class='btn-leather' size='sm' on:click={() => invalidateAll()}>
-        Try Again
-      </Button>
-      <Button class='btn-leather' size='sm' outline on:click={() => goto('/')}>
-        Return to Home
-      </Button>
-    </div>
-  </Alert>
-{/await}
+{/if} -->
+<div class='flex flex-col space-y-4 max-w-2xl'>
+  <Preview {rootId} />
+</div>
 
 <style>
   :global(.sidebar-group-leather) {
diff --git a/src/lib/components/Preview.svelte b/src/lib/components/Preview.svelte
index f555022..3b76e4a 100644
--- a/src/lib/components/Preview.svelte
+++ b/src/lib/components/Preview.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
-  import { parser, SiblingSearchDirection } from "$lib/parser";
+  import { page } from "$app/state";
+  import { pharosInstance, SiblingSearchDirection } from "$lib/parser";
   import { Button, ButtonGroup, CloseButton, Heading, Input, P, Textarea, Tooltip } from "flowbite-svelte";
   import { CaretDownSolid, CaretUpSolid, EditOutline } from "flowbite-svelte-icons";
   import { createEventDispatcher } from "svelte";
@@ -16,9 +17,9 @@
 
   const dispatch = createEventDispatcher();
 
-  let currentContent: string = $parser.getContent(rootId);
-  let title: string | undefined = $parser.getIndexTitle(rootId);
-  let orderedChildren: string[] = $parser.getOrderedChildIds(rootId);
+  let currentContent: string = $pharosInstance.getContent(rootId);
+  let title: string | undefined = $pharosInstance.getIndexTitle(rootId);
+  let orderedChildren: string[] = $pharosInstance.getOrderedChildIds(rootId);
 
   let isEditing: boolean = false;
   let hasCursor: boolean = false;
@@ -37,8 +38,8 @@
     if (needsUpdate) {
       updateCount++;
       needsUpdate = false;
-      title = $parser.getIndexTitle(rootId);
-      currentContent = $parser.getContent(rootId);
+      title = $pharosInstance.getIndexTitle(rootId);
+      currentContent = $pharosInstance.getContent(rootId);
     }
 
     if (subtreeNeedsUpdate) {
@@ -46,7 +47,7 @@
       subtreeNeedsUpdate = false;
 
       const prevChildCount = orderedChildren.length;
-      orderedChildren = $parser.getOrderedChildIds(rootId);
+      orderedChildren = $pharosInstance.getOrderedChildIds(rootId);
       const newChildCount = orderedChildren.length;
 
       // If the number of children has changed, a child has been added or removed, and a child may
@@ -62,8 +63,8 @@
   $: {
     if (parentId && allowEditing) {
       // Check for previous/next siblings on load
-      const previousSibling = $parser.getNearestSibling(rootId, depth - 1, SiblingSearchDirection.Previous);
-      const nextSibling = $parser.getNearestSibling(rootId, depth - 1, SiblingSearchDirection.Next);
+      const previousSibling = $pharosInstance.getNearestSibling(rootId, depth - 1, SiblingSearchDirection.Previous);
+      const nextSibling = $pharosInstance.getNearestSibling(rootId, depth - 1, SiblingSearchDirection.Next);
       
       // Hide arrows if no siblings exist
       hasPreviousSibling = !!previousSibling[0];
@@ -113,7 +114,7 @@
 
       }
 
-      $parser.updateEventContent(id, currentContent);
+      $pharosInstance.updateEventContent(id, currentContent);
     }
 
     isEditing = !editing;
@@ -121,25 +122,25 @@
 
   const moveUp = (rootId: string, parentId: string) => {
     // Get the previous sibling and its index
-    const [prevSiblingId, prevIndex] = $parser.getNearestSibling(rootId, depth - 1, SiblingSearchDirection.Previous);
+    const [prevSiblingId, prevIndex] = $pharosInstance.getNearestSibling(rootId, depth - 1, SiblingSearchDirection.Previous);
     if (!prevSiblingId || prevIndex == null) {
       return;
     }
 
     // Move the current event before the previous sibling.
-    $parser.moveEvent(rootId, prevSiblingId, false);
+    $pharosInstance.moveEvent(rootId, prevSiblingId, false);
     needsUpdate = true;
   };
 
   const moveDown = (rootId: string, parentId: string) => {
     // Get the next sibling and its index 
-    const [nextSiblingId, nextIndex] = $parser.getNearestSibling(rootId, depth - 1, SiblingSearchDirection.Next);
+    const [nextSiblingId, nextIndex] = $pharosInstance.getNearestSibling(rootId, depth - 1, SiblingSearchDirection.Next);
     if (!nextSiblingId || nextIndex == null) {
       return;
     }
 
     // Move the current event after the next sibling
-    $parser.moveEvent(rootId, nextSiblingId, true);
+    $pharosInstance.moveEvent(rootId, nextSiblingId, true);
     needsUpdate = true;
   };
 </script>
diff --git a/src/lib/parser.ts b/src/lib/parser.ts
index 874bb34..566bd97 100644
--- a/src/lib/parser.ts
+++ b/src/lib/parser.ts
@@ -1,6 +1,7 @@
 import NDK, { NDKEvent } from '@nostr-dev-kit/ndk';
 import { getNdkInstance } from './ndk';
-import asciidoctor, {
+import asciidoctor from 'asciidoctor';
+import type {
   AbstractBlock,
   AbstractNode,
   Asciidoctor,
@@ -8,7 +9,7 @@ import asciidoctor, {
   Document,
   Extensions,
   Section,
-  type ProcessorOptions
+  ProcessorOptions,
 } from 'asciidoctor';
 import he from 'he';
 import { writable, type Writable } from 'svelte/store';
@@ -1063,4 +1064,4 @@ export default class Pharos {
   // #endregion
 }
 
-export const parser: Writable<Pharos> = writable(new Pharos(getNdkInstance()));
+export const pharosInstance: Writable<Pharos> = writable();
diff --git a/src/routes/+layout.server.ts b/src/routes/+layout.server.ts
deleted file mode 100644
index a3d1578..0000000
--- a/src/routes/+layout.server.ts
+++ /dev/null
@@ -1 +0,0 @@
-export const ssr = false;
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
index 189f71e..2cc6dea 100644
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -1 +1,23 @@
-export const prerender = true;
+import NDK from '@nostr-dev-kit/ndk';
+import type { LayoutLoad } from './$types';
+import { standardRelays } from '$lib/consts';
+import Pharos, { pharosInstance } from '$lib/parser';
+
+export const ssr = false;
+
+export const load: LayoutLoad = () => {
+  const ndk = new NDK({
+    autoConnectUserRelays: true,
+    enableOutboxModel: true,
+    explicitRelayUrls: standardRelays,
+  });
+  ndk.connect().then(() => console.debug('ndk connected'));
+
+  const parser = new Pharos(ndk);
+  pharosInstance.set(parser);
+
+  return {
+    ndk,
+    parser,
+  };
+};
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index a5e7f1e..58201b8 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,26 +1,41 @@
-<script lang="ts">
-  import ArticleHeader from "$lib/components/ArticleHeader.svelte";
-  import { FeedType, indexKind, standardRelays } from "$lib/consts";
-  import { ndk } from "$lib/ndk";
-  import { filterValidIndexEvents } from "$lib/utils";
-  import { NDKEvent, NDKRelaySet, type NDKUser } from "@nostr-dev-kit/ndk";
-  import { Button, Dropdown, Radio, Skeleton } from "flowbite-svelte";
-  import { ChevronDownOutline } from "flowbite-svelte-icons";
+<script lang='ts'>
+  import ArticleHeader from '$lib/components/ArticleHeader.svelte';
+  import { FeedType, indexKind, standardRelays } from '$lib/consts';
+  import { filterValidIndexEvents } from '$lib/utils';
+  import NDK, { NDKEvent, NDKRelaySet, type NDKUser } from '@nostr-dev-kit/ndk';
+  import { Button, Dropdown, Radio, Skeleton } from 'flowbite-svelte';
+  import { ChevronDownOutline } from 'flowbite-svelte-icons';
+  import type { PageData } from './$types';
+  import { setContext } from 'svelte';
+
+  let { data }: { data: PageData } = $props();
+  let ndk: NDK = data.ndk;
+
+  let user: NDKUser | null | undefined = $state(ndk.activeUser);
+  let readRelays: string[] | null | undefined = $state(user?.relayUrls);
+  let userFollows: Set<NDKUser> | null | undefined = $state(null);
+  let feedType: FeedType = $state(FeedType.Relays);
+
+  $effect(() => {
+    if (user) {
+      user.follows().then(follows => userFollows = follows);
+    }
+  });
 
   const getEvents = (): Promise<Set<NDKEvent>> =>
     // @ts-ignore
-    $ndk.fetchEvents(
+    ndk.fetchEvents(
       { kinds: [indexKind] },
       { 
         groupable: true,
         skipVerification: false,
         skipValidation: false
       },
-      NDKRelaySet.fromRelayUrls(standardRelays, $ndk)
+      NDKRelaySet.fromRelayUrls(standardRelays, ndk)
     ).then(filterValidIndexEvents);
 
   const getEventsFromUserRelays = (userRelays: string[]): Promise<Set<NDKEvent>> => {
-    return $ndk
+    return ndk
       .fetchEvents(
         // @ts-ignore
         { kinds: [indexKind] },
@@ -35,7 +50,7 @@
   }
 
   const getEventsFromUserFollows = (follows: Set<NDKUser>, userRelays?: string[]): Promise<Set<NDKEvent>> => {
-    return $ndk
+    return ndk
       .fetchEvents(
         { 
           authors: Array.from(follows ?? []).map(user => user.pubkey),
@@ -74,17 +89,6 @@
     }
     return skeletonIds;
   }
-
-  let user: NDKUser | null | undefined;
-  let readRelays: string[] | null | undefined;
-  let userFollows: Set<NDKUser> | null | undefined;
-  let feedType: FeedType = FeedType.Relays;
-
-  $: {
-    user = $ndk.activeUser;
-    readRelays = user?.relayUrls;
-    user?.follows().then(follows => userFollows = follows);
-  }
 </script>
 
 <div class='leather flex flex-col flex-grow-0 space-y-4 overflow-y-auto w-max p-2'>
diff --git a/src/routes/new/compose/+page.svelte b/src/routes/new/compose/+page.svelte
index 4d9f473..380b0bc 100644
--- a/src/routes/new/compose/+page.svelte
+++ b/src/routes/new/compose/+page.svelte
@@ -1,6 +1,6 @@
 <script lang='ts'>
   import Preview from "$lib/components/Preview.svelte";
-  import { parser } from "$lib/parser";
+  import { pharosInstance } from "$lib/parser";
   import { Heading } from "flowbite-svelte";
 
   let treeNeedsUpdate: boolean = false;
@@ -17,7 +17,7 @@
   <main class='main-leather flex flex-col space-y-4 max-w-2xl w-full mt-4 mb-4'>
     <Heading tag='h1' class='h-leather mb-2'>Compose</Heading>
     {#key treeUpdateCount}
-      <Preview rootId={$parser.getRootIndexId()} allowEditing={true} bind:needsUpdate={treeNeedsUpdate} />
+      <Preview rootId={$pharosInstance.getRootIndexId()} allowEditing={true} bind:needsUpdate={treeNeedsUpdate} />
     {/key}
   </main>
 </div>
diff --git a/src/routes/new/edit/+page.svelte b/src/routes/new/edit/+page.svelte
index 9bb3302..4479cd7 100644
--- a/src/routes/new/edit/+page.svelte
+++ b/src/routes/new/edit/+page.svelte
@@ -2,7 +2,7 @@
   import { Heading, Textarea, Toolbar, ToolbarButton, Tooltip } from "flowbite-svelte";
   import { CodeOutline, EyeSolid, PaperPlaneOutline } from "flowbite-svelte-icons";
   import Preview from "$lib/components/Preview.svelte";
-  import Pharos, { parser } from "$lib/parser";
+  import Pharos, { pharosInstance } from "$lib/parser";
   import { ndk } from "$lib/ndk";
   import { goto } from "$app/navigation";
 
@@ -15,16 +15,16 @@
 
   const showPreview = () => {
     try {
-      $parser ??= new Pharos($ndk);
-      $parser.reset();
-      $parser.parse(editorText);
+      $pharosInstance ??= new Pharos($ndk);
+      $pharosInstance.reset();
+      $pharosInstance.parse(editorText);
     } catch (e) {
       console.error(e);
       // TODO: Indicate error in UI.
       return;
     }
 
-    rootIndexId = $parser.getRootIndexId();
+    rootIndexId = $pharosInstance.getRootIndexId();
     isEditing = false;
   };
 
@@ -34,15 +34,15 @@
 
   const prepareReview = () => {
     try {
-      $parser.reset();
-      $parser.parse(editorText);
+      $pharosInstance.reset();
+      $pharosInstance.parse(editorText);
     } catch (e) {
       console.error(e);
       // TODO: Indicate error in UI.
       return;
     }
 
-    $parser.generate($ndk.activeUser?.pubkey!);
+    $pharosInstance.generate($ndk.activeUser?.pubkey!);
     goto('/new/compose');
   }
 </script>
@@ -55,7 +55,7 @@
         <Textarea
           id='article-content'
           class='textarea-leather'
-          rows=8
+          rows={8}
           placeholder='Write AsciiDoc content'
           bind:value={editorText}
         >
diff --git a/src/routes/publication/+error.svelte b/src/routes/publication/+error.svelte
new file mode 100644
index 0000000..a31bec9
--- /dev/null
+++ b/src/routes/publication/+error.svelte
@@ -0,0 +1,31 @@
+<script lang='ts'>
+  import { invalidateAll, goto } from '$app/navigation';
+  import { Alert, P, Button } from 'flowbite-svelte';
+  import { ExclamationCircleOutline } from 'flowbite-svelte-icons';
+  import { page } from '$app/state';
+</script>
+
+<main>
+  <Alert>
+    <div class='flex items-center space-x-2'>
+      <ExclamationCircleOutline class='w-6 h-6' />
+      <span class='text-lg font-medium'>
+        Failed to load publication.
+      </span>
+    </div>
+    <P size='sm'>
+      Alexandria failed to find one or more of the events comprising this publication.
+    </P>
+    <P size='xs'>
+      {page.error?.message}
+    </P>
+    <div class='flex space-x-2'>
+      <Button class='btn-leather w-fit' size='sm' onclick={() => invalidateAll()}>
+        Try Again
+      </Button>
+      <Button class='btn-leather w-fit' size='sm' outline onclick={() => goto('/')}>
+        Return to Home
+      </Button>
+    </div>
+  </Alert>
+</main>
\ No newline at end of file
diff --git a/src/routes/publication/+page.ts b/src/routes/publication/+page.ts
new file mode 100644
index 0000000..e0a7f0e
--- /dev/null
+++ b/src/routes/publication/+page.ts
@@ -0,0 +1,42 @@
+import { error } from '@sveltejs/kit';
+import type { NDKEvent } from '@nostr-dev-kit/ndk';
+import type { PageLoad } from './$types';
+import { pharosInstance } from '$lib/parser';
+
+export const load: PageLoad = async ({ url, parent }) => {
+  const id = url.searchParams.get('id');
+  const dTag = url.searchParams.get('d');
+
+  const { ndk, parser } = await parent();
+
+  let eventPromise: Promise<NDKEvent | null>;
+
+  let indexEvent: NDKEvent | null;
+
+  if (id) {
+    eventPromise = ndk.fetchEvent(id)
+      .then((ev: NDKEvent | null) => {
+        return ev;
+      })
+      .catch((err: any) => {
+        error(404, `Failed to fetch publication root event for ID: ${id}\n${err}`);
+      });
+  } else if (dTag) {
+    eventPromise = ndk.fetchEvent({ '#d': [dTag] })
+      .then((ev: NDKEvent | null) => {
+        return ev;
+      })
+      .catch((err: any) => {
+        error(404, `Failed to fetch publication root event for d tag: ${dTag}\n${err}`);
+      });
+  } else {
+    error(400, 'No publication root event ID or d tag provided.');
+  }
+
+  indexEvent = await eventPromise as NDKEvent;
+  const fetchPromise = parser.fetch(indexEvent);
+
+  return {
+    waitable: fetchPromise,
+  };
+};
diff --git a/svelte.config.js b/svelte.config.js
index 4a3459b..cadd15c 100644
--- a/svelte.config.js
+++ b/svelte.config.js
@@ -12,7 +12,7 @@ const config = {
     adapter: adapter({
       pages: 'build',
       assets: 'build',
-      fallback: null,  // TODO: Create a 404.html page.
+      fallback: 'index.html',
       precompress: false,
       strict: true,
     }),