chore: better loading

Author: dan-online

src/index.tsx

@@ -3,38 +3,36 @@ import { Router } from '@solidjs/router';
 import { render } from 'solid-js/web';
 import { App } from './App';
 import './assets/css/main.css';
+const Main = () => (
+  <MetaProvider>
+    <Title>JOSH | Home</Title>
+    <Meta name='title' content='JOSH | Home' />
+    <Meta
+      name='description'
+      content='JOSH is the JavaScript Object Storage Helper - a simple, effective, and efficient database wrapper written in Typescript'
+    />
 
-render(
-  () => (
-    <MetaProvider>
-      <Title>JOSH | Home</Title>
-      <Meta name='title' content='JOSH | Home' />
-      <Meta
-        name='description'
-        content='JOSH is the JavaScript Object Storage Helper - a simple, effective, and efficient database wrapper written in Typescript'
-      />
+    <Meta property='og:type' content='website' />
+    <Meta property='og:url' content='https://josh.evie.dev/' />
+    <Meta property='og:title' content='JOSH | Home' />
+    <Meta
+      property='og:description'
+      content='JOSH is the JavaScript Object Storage Helper - a simple, effective, and efficient database wrapper written in Typescript'
+    />
+    <Meta property='og:image' content='https://josh.evie.dev/.gitbook/assets/josh_p_light.svg' />
 
-      <Meta property='og:type' content='website' />
-      <Meta property='og:url' content='https://josh.evie.dev/' />
-      <Meta property='og:title' content='JOSH | Home' />
-      <Meta
-        property='og:description'
-        content='JOSH is the JavaScript Object Storage Helper - a simple, effective, and efficient database wrapper written in Typescript'
-      />
-      <Meta property='og:image' content='https://josh.evie.dev/.gitbook/assets/josh_p_light.svg' />
-
-      <Meta property='twitter:card' content='summary_large_image' />
-      <Meta property='twitter:url' content='https://josh.evie.dev/' />
-      <Meta property='twitter:title' content='JOSH | Home' />
-      <Meta
-        property='twitter:description'
-        content='JOSH is the JavaScript Object Storage Helper - a simple, effective, and efficient database wrapper written in Typescript'
-      />
-      <Meta property='twitter:image' content='https://josh.evie.dev/.gitbook/assets/josh_p_light.svg' />
-      <Router>
-        <App />
-      </Router>
-    </MetaProvider>
-  ),
-  document.getElementById('root')!
+    <Meta property='twitter:card' content='summary_large_image' />
+    <Meta property='twitter:url' content='https://josh.evie.dev/' />
+    <Meta property='twitter:title' content='JOSH | Home' />
+    <Meta
+      property='twitter:description'
+      content='JOSH is the JavaScript Object Storage Helper - a simple, effective, and efficient database wrapper written in Typescript'
+    />
+    <Meta property='twitter:image' content='https://josh.evie.dev/.gitbook/assets/josh_p_light.svg' />
+    <Router>
+      <App />
+    </Router>
+  </MetaProvider>
 );
+
+render(() => <Main />, document.getElementById('root')!);

src/pages/Home.tsx

@@ -6,11 +6,11 @@ import packages from '../store/packages';
 import { md } from '../utils/mdit';
 
 const Home = () => {
-  const [code] = createSignal(`\`\`\`ts\nimport { Josh } from "@joshdb/core";
+  const code = `\`\`\`ts\nimport { Josh } from "@joshdb/core";
 
 const josh = new Josh({ name: "website" });
 
-await josh.set("foo", "bar");\n\`\`\``);
+await josh.set("foo", "bar");\n\`\`\``;
 
   const [pkgs] = packages;
   const [pkg, setPackage] = createSignal('core');
@@ -88,7 +88,7 @@ await josh.set("foo", "bar");\n\`\`\``);
         </div>
         <div class='sm:w-1/2 sm:px-8 mt-8 sm:mt-0'>
           <div
-            innerHTML={md.render(code())}
+            innerHTML={md.render(code)}
             class='bg-zinc-800 px-8 sm:px-0 text-white rounded-lg shadow-xl py-8 sm:px-10 text-sm sm:text-md xl:text-lg sm:py-10'
           ></div>
           <div></div>

src/routes.ts

@@ -1,12 +1,12 @@
 import type { RouteDefinition } from '@solidjs/router';
-import { lazy } from 'solid-js';
 import Docs from './pages/Docs';
+import Home from './pages/Home';
 import NotFound from './pages/NotFound';
 
 export const routes: RouteDefinition[] = [
   {
     path: '/',
-    component: lazy(() => import('./pages/Home'))
+    component: Home
   },
   {
     path: ['/docs', '/docs/guide', '/docs/guide/:category', '/docs/guide/:category/:page', '/docs/', '/docs/:pkg', '/docs/:pkg/:type'],