feat(opennext): optimize ram; caching

Author: Cloud User

src/app/api/chat/route.ts

@@ -5,9 +5,9 @@ import {
   smoothStream,
   stepCountIs,
   streamText,
-  Tool,
   UIMessage,
 } from "ai";
+import type { Tool } from "ai";
 
 import { customModelProvider, isToolCallUnsupportedModel } from "lib/ai/models";
 
@@ -45,10 +45,7 @@ import {
 import { getSession } from "auth/server";
 import { colorize } from "consola/utils";
 import { generateUUID } from "lib/utils";
-import { nanoBananaTool, openaiImageTool } from "lib/ai/tools/image";
 import { ImageToolName } from "lib/ai/tools";
-import { buildCsvIngestionPreviewParts } from "@/lib/ai/ingest/csv-ingest";
-import { serverFileStorage } from "lib/file-storage";
 
 const logger = globalLogger.withDefaults({
   message: colorize("blackBright", `Chat API: `),
@@ -105,10 +102,16 @@ export async function POST(request: Request) {
     if (messages.at(-1)?.id == message.id) {
       messages.pop();
     }
-    const ingestionPreviewParts = await buildCsvIngestionPreviewParts(
-      attachments,
-      (key) => serverFileStorage.download(key),
-    );
+    const ingestionPreviewParts = attachments.length
+      ? await Promise.all([
+          import("@/lib/ai/ingest/csv-ingest"),
+          import("lib/file-storage"),
+        ]).then(([{ buildCsvIngestionPreviewParts }, { serverFileStorage }]) =>
+          buildCsvIngestionPreviewParts(attachments, (key) =>
+            serverFileStorage.download(key),
+          ),
+        )
+      : [];
     if (ingestionPreviewParts.length) {
       const baseParts = [...message.parts];
       let insertionIndex = -1;
@@ -268,14 +271,14 @@ export async function POST(request: Request) {
           !supportToolCall && buildToolCallUnsupportedModelSystemPrompt,
         );
 
-        const IMAGE_TOOL: Record<string, Tool> = useImageTool
-          ? {
-              [ImageToolName]:
-                imageTool?.model === "google"
-                  ? nanoBananaTool
-                  : openaiImageTool,
-            }
-          : {};
+        const IMAGE_TOOL: Record<string, Tool> = {};
+        if (useImageTool) {
+          const { nanoBananaTool, openaiImageTool } = await import(
+            "lib/ai/tools/image"
+          );
+          IMAGE_TOOL[ImageToolName] =
+            imageTool?.model === "google" ? nanoBananaTool : openaiImageTool;
+        }
         const vercelAITooles = safe({
           ...MCP_TOOLS,
           ...WORKFLOW_TOOLS,

src/components/pre-block.tsx

@@ -1,17 +1,7 @@
 "use client";
 
 import type { JSX } from "react";
-import {
-  bundledLanguages,
-  codeToHast,
-  type BundledLanguage,
-} from "shiki/bundle/web";
-import { Fragment, useLayoutEffect, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { toJsxRuntime } from "hast-util-to-jsx-runtime";
-import { safe } from "ts-safe";
 import { cn } from "lib/utils";
-import { useTheme } from "next-themes";
 import { Button } from "ui/button";
 import { CheckIcon, CopyIcon } from "lucide-react";
 import JsonView from "ui/json-view";
@@ -76,15 +66,7 @@ const PurePre = ({
   );
 };
 
-export async function Highlight(
-  code: string,
-  lang: BundledLanguage | (string & {}),
-  theme: string,
-) {
-  const parsed: BundledLanguage = (
-    bundledLanguages[lang] ? lang : "md"
-  ) as BundledLanguage;
-
+export function Highlight(code: string, lang: string): JSX.Element {
   if (lang === "json") {
     return (
       <PurePre code={code} lang={lang}>
@@ -101,50 +83,22 @@ export async function Highlight(
     );
   }
 
-  const out = await codeToHast(code, {
-    lang: parsed,
-    theme,
-  });
-
-  return toJsxRuntime(out, {
-    Fragment,
-    jsx,
-    jsxs,
-    components: {
-      pre: (props) => <PurePre {...props} code={code} lang={lang} />,
-    },
-  }) as JSX.Element;
+  return (
+    <PurePre code={code} lang={lang}>
+      <code className={`language-${lang}`}>{code}</code>
+    </PurePre>
+  );
 }
 
 export function PreBlock({ children }: { children: any }) {
   const code = children.props.children;
-  const { theme } = useTheme();
   const language = children.props.className?.split("-")?.[1] || "bash";
-  const [loading, setLoading] = useState(true);
-  const [component, setComponent] = useState<JSX.Element | null>(
-    <PurePre className="animate-pulse" code={code} lang={language}>
-      {children}
-    </PurePre>,
-  );
-
-  useLayoutEffect(() => {
-    safe()
-      .map(() =>
-        Highlight(
-          code,
-          language,
-          theme == "dark" ? "dark-plus" : "github-light",
-        ),
-      )
-      .ifOk(setComponent)
-      .watch(() => setLoading(false));
-  }, [theme, language, code]);
+  const component = Highlight(code, language);
 
   // For other code blocks, render as before
   return (
     <div
       className={cn(
-        loading && "animate-pulse",
         "text-sm flex bg-secondary/40 shadow border flex-col rounded relative my-4 overflow-hidden",
       )}
     >

src/components/ui/CodeBlock.tsx

@@ -1,11 +1,5 @@
 "use client";
-import { toJsxRuntime } from "hast-util-to-jsx-runtime";
-import { useTheme } from "next-themes";
-import { Fragment, useLayoutEffect, useState } from "react";
-import type { JSX, ReactNode } from "react";
-import { codeToHast } from "shiki/bundle/web";
-import { safe } from "ts-safe";
-import { jsx, jsxs } from "react/jsx-runtime";
+import type { ReactNode } from "react";
 import { cn } from "lib/utils";
 
 export function CodeBlock({
@@ -21,48 +15,20 @@ export function CodeBlock({
   className?: string;
   showLineNumbers?: boolean;
 }) {
-  const { theme } = useTheme();
-
-  const [component, setComponent] = useState<JSX.Element | null>(null);
-
-  useLayoutEffect(() => {
-    safe()
-      .map(async () => {
-        const out = await codeToHast(code || "", {
-          lang: lang,
-          theme: theme == "dark" ? "github-dark" : "github-light",
-        });
-        return toJsxRuntime(out, {
-          Fragment,
-          jsx,
-          jsxs,
-          components: {
-            pre: (props) => (
-              <pre
-                {...props}
-                lang={lang}
-                style={undefined}
-                className={cn(props.className, className)}
-              >
-                <div className={cn(showLineNumbers && "pl-12 relative")}>
-                  {showLineNumbers && (
-                    <div className="absolute left-0 top-0 w-6 flex flex-col select-none text-right text-muted-foreground">
-                      {code?.split("\n").map((_, index) => (
-                        <span key={index}>{index + 1}</span>
-                      ))}
-                    </div>
-                  )}
-                  {props.children}
-                </div>
-              </pre>
-            ),
-          },
-        }) as JSX.Element;
-      })
-      .ifOk(setComponent);
-  }, [theme, lang, code]);
-
   if (!code) return fallback;
 
-  return component ?? fallback;
+  return (
+    <pre lang={lang} className={cn("overflow-x-auto", className)}>
+      <div className={cn(showLineNumbers && "pl-12 relative")}>
+        {showLineNumbers && (
+          <div className="absolute left-0 top-0 w-6 flex flex-col select-none text-right text-muted-foreground">
+            {code.split("\n").map((_, index) => (
+              <span key={index}>{index + 1}</span>
+            ))}
+          </div>
+        )}
+        <code>{code}</code>
+      </div>
+    </pre>
+  );
 }

src/lib/db/pg/db.pg.ts

@@ -16,8 +16,10 @@ const getCloudflareContext: GetCloudflareContext | undefined =
     : undefined;
 
 const createPgDb = (connectionString: string) => {
+  const isCloudflareWorker = process.env.APP_RUNTIME === "cloudflare-workers";
   const pool = new Pool({
     connectionString,
+    max: isCloudflareWorker ? 1 : undefined,
     maxUses: 1,
   });
 

wrangler.jsonc

@@ -2,17 +2,22 @@
   "$schema": "node_modules/wrangler/config-schema.json",
   "main": ".open-next/worker.js",
   "name": "semantyka-app-better-chatbot",
-  "compatibility_date": "2026-07-05",
+  "compatibility_date": "2026-07-06",
   "compatibility_flags": ["nodejs_compat", "global_fetch_strictly_public"],
+  "observability": {
+    "enabled": true,
+  },
+  "cache": {
+    "enabled": true,
+  },
   "assets": {
     "directory": ".open-next/assets",
-    "binding": "ASSETS"
+    "binding": "ASSETS",
   },
   "services": [
     {
       "binding": "WORKER_SELF_REFERENCE",
-      "service": "semantyka-app-better-chatbot"
-    }
+    },
   ],
   "vars": {
     "APP_RUNTIME": "cloudflare-workers",
@@ -22,13 +27,13 @@
     "FILE_STORAGE_PREFIX": "uploads",
     "MCP_REMOTE_ONLY": "1",
     "FILE_BASED_MCP_CONFIG": "false",
-    "NEXTJS_ENV": "production"
+    "NEXTJS_ENV": "production",
   },
   "hyperdrive": [
     {
       "binding": "HYPERDRIVE",
       "id": "replace-with-hyperdrive-id",
-      "localConnectionString": "postgres://your_username:your_password@localhost:5432/your_database_name"
-    }
-  ]
+      "localConnectionString": "postgres://your_username:your_password@localhost:5432/your_database_name",
+    },
+  ],
 }