QwikDev · thejackshelton · Jul 11, 2024 · Jul 4, 2024 · Jul 8, 2024 · Jul 10, 2024
diff --git a/.changeset/small-ways-taste.md b/.changeset/small-ways-taste.md
@@ -0,0 +1,6 @@
+---
+"@qwikdev/create-astro": minor
+"@qwikdev/astro": minor
+---
+
+refactor: major performance improvements
diff --git a/apps/deno-demo/package.json b/apps/deno-demo/package.json
@@ -14,7 +14,7 @@
     "@astrojs/check": "^0.5.10",
     "@astrojs/deno": "^5.0.1",
     "@astrojs/react": "^3.0.10",
-    "@builder.io/qwik": "^1.5.1",
+    "@builder.io/qwik": "^1.7",
     "@qwikdev/astro": "workspace:*",
     "@types/react": "^18.2.64",
     "@types/react-dom": "^18.2.21",

diff --git a/apps/node-demo/astro.config.mjs b/apps/node-demo/astro.config.mjs
@@ -1,7 +1,6 @@
 import { defineConfig } from "astro/config";
 
 import node from "@astrojs/node";
-import react from "@astrojs/react";
 import qwik from "@qwikdev/astro";
 
 // https://astro.build/config
@@ -11,5 +10,5 @@ export default defineConfig({
     mode: "standalone"
   }),
 
-  integrations: [qwik({ include: "**/qwik/*" }), react({ include: "**/react/*" })]
+  integrations: [qwik({ include: "**/qwik/*" })]
 });
diff --git a/apps/node-demo/package.json b/apps/node-demo/package.json
@@ -14,7 +14,7 @@
   "dependencies": {
     "@astrojs/node": "^8.2.3",
     "@astrojs/react": "^3.0.10",
-    "@builder.io/qwik": "^1.5.1",
+    "@builder.io/qwik": "^1.7.1",
     "@qwikdev/astro": "workspace:*",
     "@types/react": "^18.2.64",
     "@types/react-dom": "^18.2.21",

diff --git a/apps/node-demo/src/pages/index.astro b/apps/node-demo/src/pages/index.astro
@@ -1,5 +1,4 @@
 ---
-import { ViewTransitions } from "astro:transitions";
 import { Counter } from "@components/qwik/counter";
 import { SayHi } from "@components/qwik/say-hi";
 ---
@@ -11,7 +10,6 @@ import { SayHi } from "@components/qwik/say-hi";
 		<meta name="viewport" content="width=device-width" />
 		<meta name="generator" content={Astro.generator} />
 		<title>Astro</title>
-		<ViewTransitions />
 	</head>
 	<body>
 		<div style={{ height: '1000px' }}>

diff --git a/libs/create-qwikdev-astro/stubs/templates/deno-biome/package.json b/libs/create-qwikdev-astro/stubs/templates/deno-biome/package.json
@@ -22,7 +22,7 @@
   "dependencies": {
     "@astrojs/check": "^0.5.10",
     "@astrojs/deno": "^5.0.1",
-    "@builder.io/qwik": "1.5.6",
+    "@builder.io/qwik": "^1.7.1",
     "@qwikdev/astro": "^0.5.13",
     "astro": "^4.5.12",
     "typescript": "^5.4.3"

diff --git a/libs/create-qwikdev-astro/stubs/templates/deno/package.json b/libs/create-qwikdev-astro/stubs/templates/deno/package.json
@@ -23,7 +23,7 @@
   "dependencies": {
     "@astrojs/check": "^0.5.10",
     "@astrojs/deno": "^5.0.1",
-    "@builder.io/qwik": "1.5.6",
+    "@builder.io/qwik": "^1.7.1",
     "@qwikdev/astro": "^0.5.14",
     "astro": "^4.6.3",
     "typescript": "^5.4.5"

diff --git a/libs/create-qwikdev-astro/stubs/templates/node-biome/package.json b/libs/create-qwikdev-astro/stubs/templates/node-biome/package.json
@@ -21,7 +21,7 @@
   "dependencies": {
     "@astrojs/check": "^0.5.10",
     "@astrojs/node": "^8.2.5",
-    "@builder.io/qwik": "1.5.6",
+    "@builder.io/qwik": "^1.7.1",
     "@qwikdev/astro": "^0.5.14",
     "astro": "^4.6.3",
     "typescript": "^5.4.5"

diff --git a/libs/create-qwikdev-astro/stubs/templates/node/package.json b/libs/create-qwikdev-astro/stubs/templates/node/package.json
@@ -22,7 +22,7 @@
   "dependencies": {
     "@astrojs/check": "^0.5.10",
     "@astrojs/node": "^8.2.5",
-    "@builder.io/qwik": "1.5.6",
+    "@builder.io/qwik": "^1.7.1",
     "@qwikdev/astro": "^0.5.14",
     "astro": "^4.6.3",
     "typescript": "^5.4.5"

diff --git a/libs/qwikdev-astro/package.json b/libs/qwikdev-astro/package.json
@@ -25,7 +25,8 @@
   "main": "./src/index.ts",
   "exports": {
     ".": "./src/index.ts",
-    "./package.json": "./package.json"
+    "./package.json": "./package.json",
+    "./server": "./server.ts"
   },
   "files": ["src", "src/index.ts", "server.ts", "env.d.ts"],
   "keywords": [
@@ -49,15 +50,15 @@
     "vite-tsconfig-paths": "^4.2.1"
   },
   "devDependencies": {
-    "@builder.io/qwik": "1.5.6",
+    "@builder.io/qwik": "^1.7.1",
     "@types/fs-extra": "^11.0.4",
     "@types/node": "^20.10.0",
     "astro": "^4.5",
     "typescript": "^5.4.2",
-    "vite": "^5.2.6"
+    "vite": "^5.3"
   },
   "peerDependencies": {
-    "@builder.io/qwik": "1.5.6",
+    "@builder.io/qwik": "^1.7.1",
     "typescript": "^5.4.2"
   }
 }
diff --git a/libs/qwikdev-astro/server.ts b/libs/qwikdev-astro/server.ts
@@ -6,9 +6,8 @@ import {
   PrefetchServiceWorker,
   jsx
 } from "@builder.io/qwik";
-import type { QwikManifest, SymbolMapperFn } from "@builder.io/qwik/optimizer";
-
 import { isDev } from "@builder.io/qwik/build";
+import { type QwikManifest } from "@builder.io/qwik/optimizer";
 import { getQwikLoaderScript, renderToString } from "@builder.io/qwik/server";
 import { manifest } from "@qwik-client-manifest";
 
@@ -94,22 +93,6 @@ export async function renderToStaticMarkup(
       children: [qwikScripts, ...(defaultSlot ? [defaultSlot] : []), ...slotValues]
     });
 
-    /**
-      For a given symbol (QRL such as `onKeydown$`) the server needs to know which bundle the symbol is in. 
-
-      Normally this is provided by Qwik's `q-manifest` . But `q-manifest` only exists after a full client build. 
-
-      This would be a problem in dev mode. So in dev mode the symbol is mapped to the expected URL using the symbolMapper function above. For Vite the given path is fixed for a given symbol.
-    */
-    const symbolMapper: SymbolMapperFn = (symbolName: string) => {
-      /* don't want to add a file path for sync$ */
-      if (symbolName === "<sync>") {
-        return;
-      }
-
-      return [symbolName, `/${process.env.SRC_DIR}/${symbolName.toLocaleLowerCase()}.js`];
-    };
-
     if (shouldAddQwikLoader) {
       qwikLoaderAdded.set(this.result, true);
     }
@@ -123,8 +106,9 @@ export async function renderToStaticMarkup(
       base,
       containerTagName: "div",
       containerAttributes: { style: "display: contents" },
-      manifest: isDev ? ({} as QwikManifest) : manifest,
-      ...(manifest ? undefined : { symbolMapper }),
+      ...(isDev
+        ? { manifest: {} as QwikManifest, symbolMapper: globalThis.symbolMapperGlobal }
+        : { manifest }),
       qwikLoader: { include: "never" }
     });
 

diff --git a/libs/qwikdev-astro/src/index.ts b/libs/qwikdev-astro/src/index.ts
@@ -11,13 +11,18 @@ import type { AstroConfig } from "astro";
 import { z } from "astro/zod";
 import ts from "typescript";
 
-import { qwikVite } from "@builder.io/qwik/optimizer";
-import { createResolver, defineIntegration } from "astro-integration-kit";
+import { type SymbolMapperFn, qwikVite } from "@builder.io/qwik/optimizer";
+import { symbolMapper } from "@builder.io/qwik/optimizer";
+import { defineIntegration } from "astro-integration-kit";
 import { watchIntegrationPlugin } from "astro-integration-kit/plugins";
 
 import { type InlineConfig, build, createFilter } from "vite";
 import tsconfigPaths from "vite-tsconfig-paths";
 
+declare global {
+  var symbolMapperGlobal: SymbolMapperFn;
+}
+
 /* Similar to vite's FilterPattern */
 const FilternPatternSchema = z.union([
   z.string(),
@@ -47,19 +52,17 @@ export default defineIntegration({
 
     const tempDir = join(`tmp-${hash()}`);
     const filter = createFilter(options.include, options.exclude);
-    const { resolve } = createResolver(import.meta.url);
 
     return {
       "astro:config:setup": async ({
         addRenderer,
         updateConfig,
         config,
         command,
-        injectScript,
-        watchIntegration
+        injectScript
       }) => {
-        // Integration HMR
-        watchIntegration(resolve());
+        // // Integration HMR
+        // watchIntegration(resolve());
 
         // Because Astro uses the same port for both dev and preview, we need to unregister the SW in order to avoid a stale SW in dev mode.
         if (command === "dev") {
@@ -85,7 +88,7 @@ export default defineIntegration({
         if ((await entrypoints).length !== 0) {
           addRenderer({
             name: "@qwikdev/astro",
-            serverEntrypoint: resolve("../server.ts")
+            serverEntrypoint: "@qwikdev/astro/server"
           });
 
           // Update the global dist directory
@@ -107,6 +110,18 @@ export default defineIntegration({
               },
 
               plugins: [
+                {
+                  name: "grabSymbolMapper",
+                  configResolved() {
+                    /** We need to get the symbolMapper straight from qwikVite here. You can think of it as the "manifest" for dev mode. */
+                    globalThis.symbolMapperGlobal = symbolMapper;
+                    setTimeout(() => {
+                      console.log(
+                        "\x1b[32m[Qwik Astro]: Ignore the Vite emitFile warning, as it's not an issue and this error message will be resolved in the next Qwik version.\x1b[0m"
+                      );
+                    }, 5000);
+                  }
+                },
                 qwikVite({
                   /* user passed include & exclude config (to use multiple JSX frameworks) */
                   fileFilter: (id: string, hook: string) => {
@@ -127,7 +142,7 @@ export default defineIntegration({
                     input: await entrypoints
                   },
                   ssr: {
-                    input: resolve("../server.ts")
+                    input: "@qwikdev/astro/server"
                   }
                 }),
                 tsconfigPaths(),
@@ -163,15 +178,15 @@ export default defineIntegration({
                 enforce: "pre",
                 name: "astro-noop",
 
-                load(id) {
+                load(id: string) {
                   if (id.endsWith(".astro")) {
                     return "export default function() {}";
                   }
                   return null;
                 }
               }
             ]
-          } as InlineConfig);
+          } as unknown as InlineConfig);
 
           await moveArtifacts(distDir, tempDir);
         } else {