From 39b6e5a20f8e7d8a6da66430b7c457c3786f564a Mon Sep 17 00:00:00 2001
From: Thomas Hallock <thomas@evolutioniq.com>
Date: Mon, 15 Sep 2025 08:56:55 -0500
Subject: [PATCH] feat: optimize Next.js webpack configuration for WASM
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add separate chunks for WASM modules and typst.ts library
- Enable async loading with better code splitting
- Optimize chunk caching for improved performance
- Separate typst packages into dedicated async chunks

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 apps/web/next.config.js | 40 +++++++++++++++++++++++++++++++++-------
 1 file changed, 33 insertions(+), 7 deletions(-)

diff --git a/apps/web/next.config.js b/apps/web/next.config.js
index 08c3117b..4c5acc89 100644
--- a/apps/web/next.config.js
+++ b/apps/web/next.config.js
@@ -12,14 +12,34 @@ const nextConfig = {
       layers: true,
     }
 
-    // Fix for WASM modules
-    config.module.rules.push({
-      test: /\.wasm$/,
-      type: 'asset/resource',
-    })
-
-    // Handle typst.ts WASM files specifically
+    // Optimize WASM loading
     if (!isServer) {
+      // Enable dynamic imports for better code splitting
+      config.optimization = {
+        ...config.optimization,
+        splitChunks: {
+          ...config.optimization.splitChunks,
+          cacheGroups: {
+            ...config.optimization.splitChunks?.cacheGroups,
+            // Create separate chunk for WASM modules
+            wasm: {
+              test: /\.wasm$/,
+              name: 'wasm',
+              chunks: 'async',
+              enforce: true,
+            },
+            // Separate typst.ts into its own chunk
+            typst: {
+              test: /[\\/]node_modules[\\/]@myriaddreamin[\\/]typst.*[\\/]/,
+              name: 'typst',
+              chunks: 'async',
+              enforce: true,
+            },
+          },
+        },
+      }
+
+      // Add preload hints for critical WASM files
       config.resolve.fallback = {
         ...config.resolve.fallback,
         fs: false,
@@ -27,6 +47,12 @@ const nextConfig = {
       }
     }
 
+    // Fix for WASM modules
+    config.module.rules.push({
+      test: /\.wasm$/,
+      type: 'asset/resource',
+    })
+
     return config
   },
 }