Improved initial load time

src/App.tsx

@@ -1,17 +1,19 @@
-import { type Component, createSignal, Show, onMount, onCleanup } from 'solid-js';
+import { type Component, createSignal, Show, onMount, onCleanup, lazy, Suspense } from 'solid-js';
 import { Layout } from './components/Layout';
 import { CriticalView } from './views/CriticalView';
-import { UrgencyView } from './views/UrgencyView';
-import { PriorityView } from './views/PriorityView';
-import { MatrixView } from './views/MatrixView';
-import { SettingsView } from './views/SettingsView';
 import { AuthCallback } from './components/Auth';
 import { pb } from './lib/pocketbase';
 import { initStore } from './store';
 
+// const CriticalView = lazy(() => import('./views/CriticalView').then(m => ({ default: m.CriticalView })));
+const UrgencyView = lazy(() => import('./views/UrgencyView').then(m => ({ default: m.UrgencyView })));
+const PriorityView = lazy(() => import('./views/PriorityView').then(m => ({ default: m.PriorityView })));
+const MatrixView = lazy(() => import('./views/MatrixView').then(m => ({ default: m.MatrixView })));
+const SettingsView = lazy(() => import('./views/SettingsView').then(m => ({ default: m.SettingsView })));
+
 const App: Component = () => {
   // Basic routing state
-  const [currentView, setCurrentView] = createSignal("matrix");
+  const [currentView, setCurrentView] = createSignal("critical");
   const [isAuthenticated, setIsAuthenticated] = createSignal(pb.authStore.isValid);
 
   onMount(() => {
@@ -23,16 +25,27 @@ const App: Component = () => {
     }, true);
 
     onCleanup(() => removeListener());
+
+    // Background preload of other views
+    setTimeout(() => {
+      // CriticalView is now static
+      import('./views/UrgencyView');
+      import('./views/PriorityView');
+      import('./views/MatrixView');
+      import('./views/SettingsView');
+    }, 100);
   });
 
   return (
     <Show when={isAuthenticated()} fallback={<AuthCallback onSuccess={() => { }} />}>
       <Layout currentView={currentView()} setView={setCurrentView}>
-        <Show when={currentView() === "critical"}><CriticalView /></Show>
-        <Show when={currentView() === "urgency"}><UrgencyView /></Show>
-        <Show when={currentView() === "priority"}><PriorityView /></Show>
-        <Show when={currentView() === "matrix"}><MatrixView /></Show>
-        <Show when={currentView() === "settings"}><SettingsView /></Show>
+        <Suspense fallback={<div class="flex items-center justify-center h-full"><div class="animate-spin rounded-full h-8 w-8 border-b-2 border-primary"></div></div>}>
+          <Show when={currentView() === "critical"}><CriticalView /></Show>
+          <Show when={currentView() === "urgency"}><UrgencyView /></Show>
+          <Show when={currentView() === "priority"}><PriorityView /></Show>
+          <Show when={currentView() === "matrix"}><MatrixView /></Show>
+          <Show when={currentView() === "settings"}><SettingsView /></Show>
+        </Suspense>
       </Layout>
     </Show>
   );

src/components/Layout.tsx

@@ -1,9 +1,10 @@
-import { type Component, type JSX, createSignal, Show } from "solid-js";
+import { type Component, type JSX, createSignal, Show, lazy, Suspense, onMount } from "solid-js";
 import { Sidebar, BottomNav } from "./Navigation";
-import { QuickEntry } from "./QuickEntry";
-import { TaskDetail } from "./TaskDetail";
 import { store, activeTaskId, setActiveTaskId } from "@/store";
 import { PanelLeftOpen } from "lucide-solid";
+
+const TaskDetail = lazy(() => import("./TaskDetail").then(m => ({ default: m.TaskDetail })));
+const QuickEntry = lazy(() => import("./QuickEntry").then(m => ({ default: m.QuickEntry })));
 import { Button } from "./ui/button";
 import { cn } from "@/lib/utils";
 
@@ -17,6 +18,14 @@ export const Layout: Component<LayoutProps> = (props) => {
     const [isSidebarLocked, setIsSidebarLocked] = createSignal(true);
     const [isSidebarPeeking, setIsSidebarPeeking] = createSignal(false);
 
+    onMount(() => {
+        // Preload TaskDetail and QuickEntry in background
+        setTimeout(() => {
+            import("./TaskDetail");
+            import("./QuickEntry");
+        }, 500);
+    });
+
     // Derived active task for the detail view
     const activeTask = () => store.tasks.find(t => t.id === activeTaskId());
 
@@ -58,14 +67,18 @@ export const Layout: Component<LayoutProps> = (props) => {
                 <BottomNav currentView={props.currentView} setView={props.setView} />
             </div>
 
-            <QuickEntry />
+            <Suspense>
+                <QuickEntry />
+            </Suspense>
 
             <Show when={activeTask()}>
-                <TaskDetail
-                    task={activeTask()!}
-                    isOpen={!!activeTaskId()}
-                    onClose={() => setActiveTaskId(null)}
-                />
+                <Suspense>
+                    <TaskDetail
+                        task={activeTask()!}
+                        isOpen={!!activeTaskId()}
+                        onClose={() => setActiveTaskId(null)}
+                    />
+                </Suspense>
             </Show>
         </div>
     );

src/components/TaskDetail.tsx

@@ -183,7 +183,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
                                     const taskId = props.task.id;
                                     removeTask(taskId);
                                     props.onClose();
-                                    toast.info("Task moved to trash", {
+                                    toast.info("Task moved to trash. Find inside Settings.", {
                                         action: {
                                             label: "Undo",
                                             onClick: () => restoreTask(taskId)