diff --git a/src/App.tsx b/src/App.tsx
index 923bd86..9056ba9 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,5 +1,5 @@
 import { Button, Paper, Typography } from '@suid/material'
-import { useNdnWorkspace, initTestbed } from './Context'
+import { useNdnWorkspace } from './Context'
 import { useNavigate } from '@solidjs/router'
 
 function isSafari() {
@@ -10,8 +10,6 @@ function App() {
   const { currentConnConfig } = useNdnWorkspace()!
   const navigate = useNavigate()
 
-  initTestbed()
-
   const configToDescription = () => {
     const config = currentConnConfig()
     if (!config) {
diff --git a/src/backend/main.ts b/src/backend/main.ts
index ef7b038..ad3ed45 100644
--- a/src/backend/main.ts
+++ b/src/backend/main.ts
@@ -3,7 +3,7 @@
 import { Producer, produce, consume } from '@ndn/endpoint'
 import { Name, Interest, Component } from '@ndn/packet'
 import * as nfdmgmt from '@ndn/nfdmgmt'
-import { getYjsDoc} from '@syncedstore/core'
+import { getYjsDoc } from '@syncedstore/core'
 import * as Y from 'yjs'
 import { CertStorage } from '@ucla-irl/ndnts-aux/security'
 import { RootDocStore, initRootDoc, project, profiles, connections } from './models'
@@ -234,18 +234,17 @@ export async function bootstrapWorkspace(opts: {
       let targetSVEncoded = targetName.at(-1).value
       // load local state first with the snapshot.
       await persistStore.set('localState', targetSVEncoded)
-      
-      // Merge the SV with the local one so that when SyncAgent starts up, 
+
+      // Merge the SV with the local one so that when SyncAgent starts up,
       // it replays the local updates (in local storage), starting from snapshot's vector.
-      let localSVEncoded = await persistStore.get(aloSyncKey)
+      const localSVEncoded = await persistStore.get(aloSyncKey)
       if (localSVEncoded) {
-        let localSV = Decoder.decode(localSVEncoded, StateVector)
-        let targetSV = Decoder.decode(targetSVEncoded, StateVector)
+        const localSV = Decoder.decode(localSVEncoded, StateVector)
+        const targetSV = Decoder.decode(targetSVEncoded, StateVector)
         targetSV.mergeFrom(localSV)
         targetSVEncoded = Encoder.encode(targetSV)
       }
       await persistStore.set(aloSyncKey, targetSVEncoded)
-
     } catch (err: any) {
       console.warn(err)
       console.log('Aborting snapshot retrieval, falling back to SVS')
diff --git a/src/index.tsx b/src/index.tsx
index 2b81589..4f2ef14 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -15,7 +15,7 @@ import Root from './components/root-wrapper'
 import App from './App'
 import ShareLatex from './components/share-latex'
 import OauthTest from './components/oauth-test'
-import { NdnWorkspaceProvider, useNdnWorkspace } from './Context'
+import { NdnWorkspaceProvider, useNdnWorkspace, initTestbed } from './Context'
 import { Connect, StoredConns } from './components/connect'
 import { Workspace, Profile, ConvertTestbed } from './components/workspace'
 import { project } from './backend/models'
@@ -23,49 +23,54 @@ import { Toaster } from 'solid-toast'
 import { Chat } from './components/chat/chat'
 import ConfigPage from './components/config'
 
-const root = document.getElementById('root')
+const rootElement = document.getElementById('root')!
 
-const rootComponent = (props: RouteSectionProps) => (
-  <Root
-    routes={[
-      { icon: <HomeIcon />, href: '/', title: 'Home' },
-      { icon: <AppsIcon />, href: '/profile', title: 'Workspace' },
-      {
-        icon: <DescriptionIcon />,
-        href: `/latex/${project.RootId}`,
-        title: 'Editor',
-        level: 1, // not displayed by default
-        trigger: () => {
-          const { booted } = useNdnWorkspace()!
-          return booted()
+function RootComponent(props: RouteSectionProps) {
+  // Global initialization
+  initTestbed()
+
+  return (
+    <Root
+      routes={[
+        { icon: <HomeIcon />, href: '/', title: 'Home' },
+        { icon: <AppsIcon />, href: '/profile', title: 'Workspace' },
+        {
+          icon: <DescriptionIcon />,
+          href: `/latex/${project.RootId}`,
+          title: 'Editor',
+          level: 1, // not displayed by default
+          trigger: () => {
+            const { booted } = useNdnWorkspace()!
+            return booted()
+          },
         },
-      },
-      {
-        icon: <ChatIcon />,
-        href: '/chat',
-        title: 'Chat',
-        level: 1, // not displayed by default
-        trigger: () => {
-          const { booted } = useNdnWorkspace()!
-          return booted()
+        {
+          icon: <ChatIcon />,
+          href: '/chat',
+          title: 'Chat',
+          level: 1, // not displayed by default
+          trigger: () => {
+            const { booted } = useNdnWorkspace()!
+            return booted()
+          },
         },
-      },
-      {
-        icon: <SettingsEthernetIcon />,
-        href: '/connection',
-        title: 'Connection',
-      },
-      { icon: <SettingsIcon />, href: '/config-page', title: 'Settings' },
-    ]}
-  >
-    {props.children}
-  </Root>
-)
+        {
+          icon: <SettingsEthernetIcon />,
+          href: '/connection',
+          title: 'Connection',
+        },
+        { icon: <SettingsIcon />, href: '/config-page', title: 'Settings' },
+      ]}
+    >
+      {props.children}
+    </Root>
+  )
+}
 
 render(
   () => (
     <NdnWorkspaceProvider>
-      <Router root={rootComponent}>
+      <Router root={RootComponent}>
         <Route path="/" component={App} />
         <Route path="/latex/:itemId" component={() => <ShareLatex rootUri="/latex" />} />
         <Route path="/connection/add" component={Connect} />
@@ -81,5 +86,5 @@ render(
       <Toaster />
     </NdnWorkspaceProvider>
   ),
-  root!,
+  rootElement,
 )