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
   },
 }