From ce31f2d061ce30e5936c3d95b34d29e2c50dd0b5 Mon Sep 17 00:00:00 2001
From: Olly Betts <olly@survex.com>
Date: Thu, 23 Jan 2025 08:34:42 +1300
Subject: [PATCH 1/8] Hook up sound from jsbeeb

This patch does get us working sound, but during loading a modal
full-window error pops up:

Uncaught runtime errors:
ERROR
The operation was aborted.

Clicking the X in the top right continues to a working owlet.  I've
failed to work out where this is coming from.

Fixes #80
---
 src/emulator.js | 24 +++++++++++++++++-------
 src/root.html   |  3 +++
 2 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/src/emulator.js b/src/emulator.js
index 6c9b281..c236924 100644
--- a/src/emulator.js
+++ b/src/emulator.js
@@ -1,10 +1,10 @@
+import $ from "jquery";
 import _ from "underscore";
 import {Cpu6502} from "jsbeeb/6502";
 import * as canvasLib from "jsbeeb/canvas";
 import {Video} from "jsbeeb/video";
 import {Debugger} from "jsbeeb/web/debug";
-import {FakeSoundChip} from "jsbeeb/soundchip";
-import {FakeDdNoise} from "jsbeeb/ddnoise";
+import {AudioHandler} from "jsbeeb/web/audio-handler";
 import * as models from "jsbeeb/models";
 import {Cmos} from "jsbeeb/cmos";
 import * as utils from "jsbeeb/utils";
@@ -98,8 +98,14 @@ export class Emulator {
 
         this.video = new Video(Model.isMaster, this.canvas.fb32, _.bind(this.paint, this));
 
-        this.soundChip = new FakeSoundChip();
-        this.ddNoise = new FakeDdNoise();
+        const audioFilterFreq = 7000;
+        const audioFilterQ = 5;
+        const noSeek = false;
+        this.audioHandler = new AudioHandler($("#audio-warning"), audioFilterFreq, audioFilterQ, noSeek);
+        // Firefox will report that audio is suspended even when it will
+        // start playing without user interaction, so we need to delay a
+        // little to get a reliable indication.
+        window.setTimeout(() => this.audioHandler.checkStatus(), 1000);
 
         this.dbgr = new Debugger(this.video);
         const cmos = new Cmos({
@@ -120,8 +126,8 @@ export class Emulator {
             Model,
             this.dbgr,
             this.video,
-            this.soundChip,
-            this.ddNoise,
+            this.audioHandler.soundChip,
+            this.audioHandler.ddNoise,
             cmos,
             config,
         );
@@ -140,7 +146,7 @@ export class Emulator {
     }
 
     async initialise() {
-        await Promise.all([this.cpu.initialise(), this.ddNoise.initialise()]);
+        await Promise.all([this.audioHandler.initialise(), this.cpu.initialise()]);
         this.ready = true;
     }
 
@@ -163,11 +169,13 @@ export class Emulator {
 
     start() {
         if (this.running) return;
+        this.audioHandler.unmute();
         this.running = true;
         requestAnimationFrame(this.onAnimFrame);
     }
 
     pause() {
+        this.audioHandler.mute();
         this.running = false;
     }
 
@@ -299,6 +307,7 @@ export class Emulator {
 
     keyDown(event) {
         if (!this.running) return;
+        this.audioHandler.tryResume();
 
         const code = this.keyCode(event);
         const processor = this.cpu;
@@ -323,6 +332,7 @@ export class Emulator {
     }
 
     mouseMove(event) {
+        this.audioHandler.tryResume();
         this.showCoords = true;
         const processor = this.cpu;
         const screen = this.root.find(".screen");
diff --git a/src/root.html b/src/root.html
index 68fb768..c3c3e0b 100644
--- a/src/root.html
+++ b/src/root.html
@@ -6,6 +6,9 @@
     </div>
  
     <div>
+        <div id="audio-warning" class="alert alert-warning initially-hidden">
+            Your browser has suspended audio -- mouse click or key press for sound.
+        </div>
     </div>
     <div class="toolbar" id="emu_toolbar">
         <button data-action="run" title="Run the program (ctrl-enter)"><i class="fa-solid fa-play" style="pointer-events: none;"></i></button>

From 788100c3cc52fd6dc3419f39c2074a05081e8c50 Mon Sep 17 00:00:00 2001
From: Matt Godbolt <matt@godbolt.org>
Date: Mon, 21 Apr 2025 18:16:49 -0500
Subject: [PATCH 2/8] WIP

---
 package-lock.json     | 6 +++---
 package.json          | 2 +-
 src/emulator.js       | 1 +
 src/owlet-editor.less | 7 +++++++
 src/root.html         | 1 +
 5 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 4f50c82..c5e065a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,7 +11,7 @@
       "dependencies": {
         "base2048": "^2.0.2",
         "jquery": "^3.7.1",
-        "jsbeeb": "github:mattgodbolt/jsbeeb#275b99ddeaf096d2497f606a4ad0ce74991306e1",
+        "jsbeeb": "github:mattgodbolt/jsbeeb#77be55899c28223d964493c9ad8b60b1ffd37185",
         "monaco-editor": "^0.52.2",
         "promise": "^8.3.0",
         "resize-observer-polyfill": "^1.5.1",
@@ -4026,8 +4026,8 @@
     },
     "node_modules/jsbeeb": {
       "version": "0.0.7",
-      "resolved": "git+ssh://git@github.com/mattgodbolt/jsbeeb.git#275b99ddeaf096d2497f606a4ad0ce74991306e1",
-      "integrity": "sha512-/uuR1mSdeH0FssBKNMHUdh3shd5YjKRuBsc0xzZzSopzIpUJwEwgRJAk1yTTbZOwz7/w7sL2+3Amx+3Otzf68g==",
+      "resolved": "git+ssh://git@github.com/mattgodbolt/jsbeeb.git#77be55899c28223d964493c9ad8b60b1ffd37185",
+      "integrity": "sha512-Y+KatevAkLPehlcHdZVUQ3gxhuVM4gzQ8akGAfOcCR8zon4BPjnaqI7bsOCKBH6XXr2TksW7njWq+nc22M1Zuw==",
       "license": "GPL-3.0-or-later",
       "dependencies": {
         "@popperjs/core": "^2.11.8",
diff --git a/package.json b/package.json
index 5e508f0..a69c30c 100644
--- a/package.json
+++ b/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "base2048": "^2.0.2",
     "jquery": "^3.7.1",
-    "jsbeeb": "github:mattgodbolt/jsbeeb#275b99ddeaf096d2497f606a4ad0ce74991306e1",
+    "jsbeeb": "github:mattgodbolt/jsbeeb#77be55899c28223d964493c9ad8b60b1ffd37185",
     "monaco-editor": "^0.52.2",
     "promise": "^8.3.0",
     "resize-observer-polyfill": "^1.5.1",
diff --git a/src/emulator.js b/src/emulator.js
index 1553b2e..78bc830 100644
--- a/src/emulator.js
+++ b/src/emulator.js
@@ -103,6 +103,7 @@ export class Emulator {
         const noSeek = false;
         this.audioHandler = new AudioHandler(
             $("#audio-warning"),
+            $("#audio-stats")[0],
             audioFilterFreq,
             audioFilterQ,
             noSeek,
diff --git a/src/owlet-editor.less b/src/owlet-editor.less
index 17f808f..5c3c084 100644
--- a/src/owlet-editor.less
+++ b/src/owlet-editor.less
@@ -134,6 +134,13 @@ canvas.screen {
   border: none;
 }
 
+#audio-stats {
+  bottom: 0;
+  right: 0;
+  position: fixed;
+  display: none;
+}
+
 #about {
   padding: 32px;
   display: none;
diff --git a/src/root.html b/src/root.html
index d21f8be..a0fff22 100644
--- a/src/root.html
+++ b/src/root.html
@@ -57,6 +57,7 @@ <h2><a class="name"></a>
             </div>
         </div>
     </div>
+    <canvas id="audio-stats" width="400" height="100"></canvas>
     <div class="footer" id="editor_footer">
         <button data-action="expand" title="Expand abbreviations, detokenise">Decode</button>
         <button data-action="tokenise" title="Convert to BBC BASIC byte tokens">Shrink</button>

From bda1e9c73c5b5b84b42efcdb8d34b1778a8cb038 Mon Sep 17 00:00:00 2001
From: Matt Godbolt <matt@godbolt.org>
Date: Mon, 21 Apr 2025 21:24:52 -0500
Subject: [PATCH 3/8] Add middleware to support audio worklets in development
 mode
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This adds a custom Vite middleware that handles audio worklets and sound files in
development mode, enabling audio support from jsbeeb to work correctly.

- Adds jsbeeb-worklet-middleware.js to serve worklet files and sound files
- Creates a smoothie-shim.js to mock the library interface in development
- Updates vite.config.js with necessary configuration for audio support

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

Co-Authored-By: Claude <noreply@anthropic.com>
---
 jsbeeb-worklet-middleware.js | 246 +++++++++++++++++++++++++++++++++++
 src/smoothie-shim.js         |  47 +++++++
 vite.config.js               |  22 ++++
 3 files changed, 315 insertions(+)
 create mode 100644 jsbeeb-worklet-middleware.js
 create mode 100644 src/smoothie-shim.js

diff --git a/jsbeeb-worklet-middleware.js b/jsbeeb-worklet-middleware.js
new file mode 100644
index 0000000..e0a005a
--- /dev/null
+++ b/jsbeeb-worklet-middleware.js
@@ -0,0 +1,246 @@
+// jsbeeb-worklet-middleware.js
+// A Vite plugin that provides middleware to handle jsbeeb worklet files
+import {build} from "esbuild";
+import {resolve} from "path";
+import fs from "fs";
+
+// Path to jsbeeb in node_modules
+// Using '.' is more reliable than process.cwd() and avoids ESLint errors
+const jsbeebPath = resolve(".", "node_modules/jsbeeb");
+
+// Map of worklet endpoints to their source files
+const workletMap = {
+    "audio-renderer.js": resolve(jsbeebPath, "src/web/audio-renderer.js"),
+    "music5000-worklet.js": resolve(jsbeebPath, "src/music5000-worklet.js"),
+};
+
+// Base path to jsbeeb sound files
+const jsbeebSoundsPath = resolve(jsbeebPath, "public/sounds");
+
+// Create Vite plugin
+export default function jsbeebWorkletPlugin() {
+    console.log("Initializing jsbeeb worklet middleware plugin");
+    // Helper function to serve sound files (WAV, etc.)
+    function serveSound(soundPath, res) {
+        try {
+            // Ensure the sound file exists
+            if (!fs.existsSync(soundPath)) {
+                console.error(`[jsbeeb-worklet-middleware] Sound file not found: ${soundPath}`);
+                res.statusCode = 404;
+                res.end(`Sound file not found: ${soundPath}`);
+                return;
+            }
+
+            console.log(`[jsbeeb-worklet-middleware] Serving sound file from: ${soundPath}`);
+
+            // Read the sound file as binary
+            const soundData = fs.readFileSync(soundPath);
+
+            // Set appropriate content type for WAV files
+            res.setHeader("Content-Type", "audio/wav");
+            res.setHeader("Content-Length", soundData.length);
+            res.end(soundData);
+        } catch (error) {
+            console.error(`[jsbeeb-worklet-middleware] Error serving sound file:`, error);
+            res.statusCode = 500;
+            res.end(`Error serving sound file: ${error.message}`);
+        }
+    }
+
+    // Helper function to build and serve a worklet
+    async function serveWorklet(sourcePath, res) {
+        try {
+            // Ensure the source file exists
+            if (!fs.existsSync(sourcePath)) {
+                console.error(`[jsbeeb-worklet-middleware] Source file not found: ${sourcePath}`);
+                res.statusCode = 404;
+                res.end(`Worklet source file not found: ${sourcePath}`);
+                return;
+            }
+
+            // Build the worklet on demand
+            console.log(`[jsbeeb-worklet-middleware] Building worklet from: ${sourcePath}`);
+
+            // Read the source file
+            const sourceCode = fs.readFileSync(sourcePath, "utf8");
+
+            // For audio worklets, we need to ensure they have the proper context
+            // The global 'sampleRate' and 'currentTime' variables are expected in worklets
+            const preamble = `
+        // Worklet environment setup for development mode
+        const sampleRate = 44100;  // Default sample rate for most audio contexts
+        const currentTime = globalThis.currentTime || 0;
+      `;
+
+            const result = await build({
+                stdin: {
+                    contents: preamble + sourceCode,
+                    loader: "js",
+                    resolveDir: resolve(sourcePath, ".."),
+                },
+                bundle: true,
+                write: false,
+                format: "iife", // Audio worklets use IIFE format
+                target: ["es2020"],
+                outfile: "out.js",
+                define: {
+                    "process.env.NODE_ENV": '"development"',
+                },
+                // Add any necessary external modules
+                external: ["smoothie"],
+            });
+
+            // Serve the compiled result
+            console.log(`[jsbeeb-worklet-middleware] Serving built worklet`);
+            res.setHeader("Content-Type", "application/javascript");
+            res.end(result.outputFiles[0].text);
+        } catch (error) {
+            console.error(`[jsbeeb-worklet-middleware] Error building worklet:`, error);
+            res.statusCode = 500;
+            res.end(`Error building worklet: ${error.message}`);
+        }
+    }
+
+    return {
+        name: "jsbeeb-worklet-middleware",
+        // Add transform hook to handle modules during the transform phase
+        transform(code, id) {
+            // Look for specific modules to transform
+            if (id.includes("jsbeeb/src/web/audio-handler.js")) {
+                console.log(`[transform] Transforming audio-handler.js`);
+
+                // Replace the problematic imports and fix audio context for development mode
+                return code
+                    .replace(
+                        `const rendererUrl = new URL("./audio-renderer.js", import.meta.url).href;`,
+                        `// Modified by worklet middleware for dev mode
+             const rendererUrl = "/jsbeeb-worklets/audio-renderer.js";`,
+                    )
+                    .replace(
+                        `const music5000WorkletUrl = new URL("../music5000-worklet.js", import.meta.url).href;`,
+                        `// Modified by worklet middleware for dev mode
+             const music5000WorkletUrl = "/jsbeeb-worklets/music5000-worklet.js";`,
+                    )
+                    .replace(
+                        `import { SmoothieChart, TimeSeries } from "smoothie";`,
+                        `import { SmoothieChart, TimeSeries } from "/src/smoothie-shim.js";`,
+                    );
+            }
+
+            // We don't need to transform ddnoise.js - just serve the sound files correctly
+
+            // Also transform the worklet files directly to ensure they're properly formatted for AudioWorklet
+            if (
+                id.includes("jsbeeb/src/web/audio-renderer.js") ||
+                id.includes("jsbeeb/src/music5000-worklet.js")
+            ) {
+                console.log(`[transform] Transforming worklet file: ${id}`);
+                // No transformations needed for the worklet files themselves, just ensure they're processed
+                return code;
+            }
+
+            // Add other transformation rules for different files if needed
+            return null; // Return null to let Vite handle the file normally
+        },
+
+        configureServer(server) {
+            console.log("[jsbeeb-worklet-middleware] Setting up middleware for worklets");
+
+            // Handler function for smoothie
+            const handleSmoothie = (req, res) => {
+                console.log(`[jsbeeb-worklet-middleware] Intercepting smoothie.js`);
+                const shimPath = resolve(".", "src/smoothie-shim.js");
+
+                try {
+                    const content = fs.readFileSync(shimPath, "utf8");
+                    res.setHeader("Content-Type", "application/javascript");
+                    res.end(content);
+                } catch (error) {
+                    console.error(
+                        `[jsbeeb-worklet-middleware] Error serving smoothie shim:`,
+                        error,
+                    );
+                    res.statusCode = 500;
+                    res.end(`Error serving smoothie shim: ${error.message}`);
+                }
+            };
+
+            // Add the main middleware handler using recommended Vite approach
+            server.middlewares.use(async (req, res, next) => {
+                const url = req.url;
+
+                // Log all relevant requests for debugging
+                if (
+                    url.includes("jsbeeb") ||
+                    url.includes("worklet") ||
+                    url.includes("smoothie") ||
+                    url.includes("sounds/")
+                ) {
+                    console.log(`[jsbeeb-worklet-middleware] Request: ${url}`);
+                }
+
+                // Check for the specific imports we need to handle
+                if (url.includes("smoothie.js")) {
+                    handleSmoothie(req, res);
+                    return;
+                }
+
+                // Handle sound file requests with a general pattern
+                if (url.startsWith("/sounds/") && url.endsWith(".wav")) {
+                    // Map the URL path to the corresponding file in jsbeeb node_modules
+                    const soundPath = resolve(jsbeebSoundsPath, url.substring("/sounds/".length));
+                    console.log(`[jsbeeb-worklet-middleware] Serving sound file: ${url}`);
+                    serveSound(soundPath, res);
+                    return;
+                }
+
+                // Handle dedicated worklet endpoints
+                for (const workletKey in workletMap) {
+                    if (url === `/jsbeeb-worklets/${workletKey}`) {
+                        console.log(`[jsbeeb-worklet-middleware] Serving worklet: ${workletKey}`);
+                        try {
+                            await serveWorklet(workletMap[workletKey], res);
+                        } catch (error) {
+                            console.error(`Error serving worklet: ${error.message}`);
+                            res.statusCode = 500;
+                            res.end(`Error serving worklet: ${error.message}`);
+                        }
+                        return;
+                    }
+                }
+
+                // Handle various URL patterns that might be used for worklet requests
+                // Simplify pattern matching - the key is that we catch all possible variations
+                // of worklet URLs from either the URL import syntax or direct path references
+                if (url.includes("audio-renderer.js")) {
+                    console.log(`[jsbeeb-worklet-middleware] Serving audio renderer: ${url}`);
+                    try {
+                        await serveWorklet(workletMap["audio-renderer.js"], res);
+                    } catch (error) {
+                        console.error(`Error serving audio renderer: ${error.message}`);
+                        res.statusCode = 500;
+                        res.end(`Error serving worklet: ${error.message}`);
+                    }
+                    return;
+                }
+
+                if (url.includes("music5000-worklet.js")) {
+                    console.log(`[jsbeeb-worklet-middleware] Serving music5000 worklet: ${url}`);
+                    try {
+                        await serveWorklet(workletMap["music5000-worklet.js"], res);
+                    } catch (error) {
+                        console.error(`Error serving music5000 worklet: ${error.message}`);
+                        res.statusCode = 500;
+                        res.end(`Error serving worklet: ${error.message}`);
+                    }
+                    return;
+                }
+
+                // Otherwise continue with the next middleware
+                next();
+            });
+
+            // No need for extra watchers - Vite's HMR will trigger transform hooks automatically
+        },
+    };
+}
diff --git a/src/smoothie-shim.js b/src/smoothie-shim.js
new file mode 100644
index 0000000..d88a9f9
--- /dev/null
+++ b/src/smoothie-shim.js
@@ -0,0 +1,47 @@
+/**
+ * Development-only shim for smoothie.js
+ *
+ * This file provides mock implementations of SmoothieChart and TimeSeries
+ * to avoid issues with module format compatibility in development mode.
+ */
+
+// Fake implementations that provide just enough functionality for development
+export class SmoothieChart {
+    constructor(options = {}) {
+        this.options = options;
+        this.series = [];
+        console.log("Using mock SmoothieChart for development");
+    }
+
+    addTimeSeries(series, options = {}) {
+        this.series.push({series, options});
+    }
+
+    // eslint-disable-next-line no-unused-vars
+    streamTo(canvas, delay = 100) {
+        // No-op in development
+    }
+
+    static timeFormatter(date) {
+        const hours = date.getHours().toString().padStart(2, "0");
+        const minutes = date.getMinutes().toString().padStart(2, "0");
+        const seconds = date.getSeconds().toString().padStart(2, "0");
+        return `${hours}:${minutes}:${seconds}`;
+    }
+}
+
+export class TimeSeries {
+    constructor() {
+        this.data = [];
+    }
+
+    append(time, value) {
+        this.data.push({time, value});
+    }
+}
+
+// Also provide default export for compatibility
+export default {
+    SmoothieChart,
+    TimeSeries,
+};
diff --git a/vite.config.js b/vite.config.js
index 878d22a..f65e2b6 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -6,12 +6,15 @@ import {viteStaticCopy} from "vite-plugin-static-copy";
 import yaml from "@rollup/plugin-yaml";
 import {nodePolyfills} from "vite-plugin-node-polyfills";
 import {createHtmlPlugin} from "vite-plugin-html";
+import jsbeebWorkletPlugin from "./jsbeeb-worklet-middleware.js";
 
 // Get the directory name equivalent in ESM
 const __dirname = fileURLToPath(new URL(".", import.meta.url));
 
 export default defineConfig({
     plugins: [
+        // Add our custom middleware for jsbeeb worklets
+        jsbeebWorkletPlugin(),
         monacoEditorPlugin({}),
         nodePolyfills(),
         yaml(),
@@ -43,6 +46,9 @@ export default defineConfig({
     ],
     assetsInclude: ["**/*.ttf", "**/*.rom"],
     build: {
+        // This setting is critical for worklets to work correctly
+        // It prevents worklet files from being inlined which would break them
+        assetsInlineLimit: 0,
         outDir: "dist",
         minify: true,
         sourcemap: true,
@@ -61,6 +67,22 @@ export default defineConfig({
     server: {
         port: 8080,
     },
+
+    // Add this resolve section to directly alias problematic imports
+    resolve: {
+        alias: [
+            // Alias the smoothie package to our shim
+            {
+                find: "smoothie",
+                replacement: resolve(__dirname, "src/smoothie-shim.js"),
+            },
+        ],
+    },
+    optimizeDeps: {
+        // Explicitly exclude the worklet files from optimization
+        // This is critical as worklets need to be separate files
+        exclude: ["jsbeeb/src/web/audio-renderer.js", "jsbeeb/src/music5000-worklet.js"],
+    },
     css: {
         devSourcemap: true,
         preprocessorOptions: {

From 86be567acb54452af1490a8c6b0ee5bdf494d890 Mon Sep 17 00:00:00 2001
From: Matt Godbolt <matt@godbolt.org>
Date: Mon, 21 Apr 2025 21:26:15 -0500
Subject: [PATCH 4/8] Fix lint

---
 src/owlet.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/owlet.js b/src/owlet.js
index ef78038..bd0e58e 100644
--- a/src/owlet.js
+++ b/src/owlet.js
@@ -189,8 +189,8 @@ export class OwletEditor {
 
     async setState(state) {
         // Turn invisible characters into equivalent visible ones.
-        // eslint-disable-next-line no-control-regex
         const basic = state.program
+            // eslint-disable-next-line no-control-regex
             .replace(/[\x00-\x09\x0b-\x1f\x7f-\u009f]/g, function (c) {
                 return String.fromCharCode(c.charCodeAt(0) | 0x100);
             })

From eb91e90747affe60c6b6cfa716823a92c04f91d4 Mon Sep 17 00:00:00 2001
From: Matt Godbolt <matt@godbolt.org>
Date: Mon, 21 Apr 2025 21:36:46 -0500
Subject: [PATCH 5/8] More hackery

---
 jsbeeb-worklet-middleware.js | 180 +++++++++++++++++------------------
 package-lock.json            |  22 +++++
 package.json                 |   1 +
 3 files changed, 108 insertions(+), 95 deletions(-)

diff --git a/jsbeeb-worklet-middleware.js b/jsbeeb-worklet-middleware.js
index e0a005a..f126bc9 100644
--- a/jsbeeb-worklet-middleware.js
+++ b/jsbeeb-worklet-middleware.js
@@ -3,31 +3,43 @@
 import {build} from "esbuild";
 import {resolve} from "path";
 import fs from "fs";
+import mime from "mime-types";
 
 // Path to jsbeeb in node_modules
 // Using '.' is more reliable than process.cwd() and avoids ESLint errors
 const jsbeebPath = resolve(".", "node_modules/jsbeeb");
 
-// Map of worklet endpoints to their source files
-const workletMap = {
-    "audio-renderer.js": resolve(jsbeebPath, "src/web/audio-renderer.js"),
-    "music5000-worklet.js": resolve(jsbeebPath, "src/music5000-worklet.js"),
-};
-
 // Base path to jsbeeb sound files
 const jsbeebSoundsPath = resolve(jsbeebPath, "public/sounds");
 
 // Create Vite plugin
 export default function jsbeebWorkletPlugin() {
     console.log("Initializing jsbeeb worklet middleware plugin");
-    // Helper function to serve sound files (WAV, etc.)
+
+    // Map of worklet endpoints to their source files (using Map for better performance)
+    const workletMap = new Map([
+        ["audio-renderer.js", resolve(jsbeebPath, "src/web/audio-renderer.js")],
+        ["music5000-worklet.js", resolve(jsbeebPath, "src/music5000-worklet.js")],
+    ]);
+
+    // Helper function for handling errors consistently
+    function handleError(res, message, error, statusCode = 500) {
+        console.error(`[jsbeeb-worklet-middleware] ${message}:`, error);
+        res.statusCode = statusCode;
+        res.end(`${message}: ${error.message}`);
+    }
+
+    // Helper function to serve sound files
     function serveSound(soundPath, res) {
         try {
             // Ensure the sound file exists
             if (!fs.existsSync(soundPath)) {
-                console.error(`[jsbeeb-worklet-middleware] Sound file not found: ${soundPath}`);
-                res.statusCode = 404;
-                res.end(`Sound file not found: ${soundPath}`);
+                handleError(
+                    res,
+                    `Sound file not found: ${soundPath}`,
+                    {message: "File not found"},
+                    404,
+                );
                 return;
             }
 
@@ -36,14 +48,14 @@ export default function jsbeebWorkletPlugin() {
             // Read the sound file as binary
             const soundData = fs.readFileSync(soundPath);
 
-            // Set appropriate content type for WAV files
-            res.setHeader("Content-Type", "audio/wav");
+            // Determine content type based on file extension
+            const contentType = mime.lookup(soundPath) || "application/octet-stream";
+
+            res.setHeader("Content-Type", contentType);
             res.setHeader("Content-Length", soundData.length);
             res.end(soundData);
         } catch (error) {
-            console.error(`[jsbeeb-worklet-middleware] Error serving sound file:`, error);
-            res.statusCode = 500;
-            res.end(`Error serving sound file: ${error.message}`);
+            handleError(res, "Error serving sound file", error);
         }
     }
 
@@ -52,9 +64,12 @@ export default function jsbeebWorkletPlugin() {
         try {
             // Ensure the source file exists
             if (!fs.existsSync(sourcePath)) {
-                console.error(`[jsbeeb-worklet-middleware] Source file not found: ${sourcePath}`);
-                res.statusCode = 404;
-                res.end(`Worklet source file not found: ${sourcePath}`);
+                handleError(
+                    res,
+                    `Worklet source file not found: ${sourcePath}`,
+                    {message: "File not found"},
+                    404,
+                );
                 return;
             }
 
@@ -95,9 +110,7 @@ export default function jsbeebWorkletPlugin() {
             res.setHeader("Content-Type", "application/javascript");
             res.end(result.outputFiles[0].text);
         } catch (error) {
-            console.error(`[jsbeeb-worklet-middleware] Error building worklet:`, error);
-            res.statusCode = 500;
-            res.end(`Error building worklet: ${error.message}`);
+            handleError(res, "Error building worklet", error);
         }
     }
 
@@ -127,16 +140,14 @@ export default function jsbeebWorkletPlugin() {
                     );
             }
 
-            // We don't need to transform ddnoise.js - just serve the sound files correctly
-
-            // Also transform the worklet files directly to ensure they're properly formatted for AudioWorklet
-            if (
-                id.includes("jsbeeb/src/web/audio-renderer.js") ||
-                id.includes("jsbeeb/src/music5000-worklet.js")
-            ) {
-                console.log(`[transform] Transforming worklet file: ${id}`);
-                // No transformations needed for the worklet files themselves, just ensure they're processed
-                return code;
+            // Check if this is a worklet file that needs transformation
+            // Use the workletMap values to identify worklet source files
+            for (const [, sourcePath] of workletMap) {
+                if (id.includes(sourcePath)) {
+                    console.log(`[transform] Transforming worklet file: ${id}`);
+                    // No transformations needed for the worklet files themselves, just ensure they're processed
+                    return code;
+                }
             }
 
             // Add other transformation rules for different files if needed
@@ -146,92 +157,73 @@ export default function jsbeebWorkletPlugin() {
         configureServer(server) {
             console.log("[jsbeeb-worklet-middleware] Setting up middleware for worklets");
 
-            // Handler function for smoothie
-            const handleSmoothie = (req, res) => {
-                console.log(`[jsbeeb-worklet-middleware] Intercepting smoothie.js`);
-                const shimPath = resolve(".", "src/smoothie-shim.js");
-
-                try {
-                    const content = fs.readFileSync(shimPath, "utf8");
-                    res.setHeader("Content-Type", "application/javascript");
-                    res.end(content);
-                } catch (error) {
-                    console.error(
-                        `[jsbeeb-worklet-middleware] Error serving smoothie shim:`,
-                        error,
-                    );
-                    res.statusCode = 500;
-                    res.end(`Error serving smoothie shim: ${error.message}`);
-                }
-            };
-
             // Add the main middleware handler using recommended Vite approach
             server.middlewares.use(async (req, res, next) => {
                 const url = req.url;
+                const parsedUrl = new URL(url, "http://localhost");
+                const pathname = parsedUrl.pathname;
 
                 // Log all relevant requests for debugging
                 if (
-                    url.includes("jsbeeb") ||
-                    url.includes("worklet") ||
-                    url.includes("smoothie") ||
-                    url.includes("sounds/")
+                    pathname.includes("jsbeeb") ||
+                    pathname.includes("worklet") ||
+                    pathname.includes("smoothie") ||
+                    pathname.includes("sounds/")
                 ) {
-                    console.log(`[jsbeeb-worklet-middleware] Request: ${url}`);
+                    console.log(`[jsbeeb-worklet-middleware] Request: ${pathname}`);
                 }
 
-                // Check for the specific imports we need to handle
-                if (url.includes("smoothie.js")) {
-                    handleSmoothie(req, res);
+                // Check for smoothie.js import
+                if (pathname.includes("smoothie.js")) {
+                    console.log(`[jsbeeb-worklet-middleware] Intercepting smoothie.js`);
+                    const shimPath = resolve(".", "src/smoothie-shim.js");
+
+                    try {
+                        const content = fs.readFileSync(shimPath, "utf8");
+                        res.setHeader("Content-Type", "application/javascript");
+                        res.end(content);
+                    } catch (error) {
+                        handleError(res, "Error serving smoothie shim", error);
+                    }
                     return;
                 }
 
                 // Handle sound file requests with a general pattern
-                if (url.startsWith("/sounds/") && url.endsWith(".wav")) {
+                if (pathname.startsWith("/sounds/")) {
                     // Map the URL path to the corresponding file in jsbeeb node_modules
-                    const soundPath = resolve(jsbeebSoundsPath, url.substring("/sounds/".length));
-                    console.log(`[jsbeeb-worklet-middleware] Serving sound file: ${url}`);
+                    const soundPath = resolve(
+                        jsbeebSoundsPath,
+                        pathname.substring("/sounds/".length),
+                    );
+                    console.log(`[jsbeeb-worklet-middleware] Serving sound file: ${pathname}`);
                     serveSound(soundPath, res);
                     return;
                 }
 
-                // Handle dedicated worklet endpoints
-                for (const workletKey in workletMap) {
-                    if (url === `/jsbeeb-worklets/${workletKey}`) {
-                        console.log(`[jsbeeb-worklet-middleware] Serving worklet: ${workletKey}`);
-                        try {
-                            await serveWorklet(workletMap[workletKey], res);
-                        } catch (error) {
-                            console.error(`Error serving worklet: ${error.message}`);
-                            res.statusCode = 500;
-                            res.end(`Error serving worklet: ${error.message}`);
-                        }
-                        return;
-                    }
-                }
+                // Extract worklet name from URL path for various patterns
+                let workletName = null;
 
-                // Handle various URL patterns that might be used for worklet requests
-                // Simplify pattern matching - the key is that we catch all possible variations
-                // of worklet URLs from either the URL import syntax or direct path references
-                if (url.includes("audio-renderer.js")) {
-                    console.log(`[jsbeeb-worklet-middleware] Serving audio renderer: ${url}`);
-                    try {
-                        await serveWorklet(workletMap["audio-renderer.js"], res);
-                    } catch (error) {
-                        console.error(`Error serving audio renderer: ${error.message}`);
-                        res.statusCode = 500;
-                        res.end(`Error serving worklet: ${error.message}`);
+                // Check for dedicated endpoints first (most specific)
+                if (pathname.startsWith("/jsbeeb-worklets/")) {
+                    workletName = pathname.substring("/jsbeeb-worklets/".length);
+                }
+                // Then check for any other pattern containing known worklet names
+                else {
+                    for (const [key] of workletMap) {
+                        if (pathname.includes(key)) {
+                            workletName = key;
+                            break;
+                        }
                     }
-                    return;
                 }
 
-                if (url.includes("music5000-worklet.js")) {
-                    console.log(`[jsbeeb-worklet-middleware] Serving music5000 worklet: ${url}`);
+                // If we found a worklet name, try to serve it
+                if (workletName && workletMap.has(workletName)) {
+                    console.log(`[jsbeeb-worklet-middleware] Serving worklet: ${workletName}`);
                     try {
-                        await serveWorklet(workletMap["music5000-worklet.js"], res);
+                        await serveWorklet(workletMap.get(workletName), res);
                     } catch (error) {
-                        console.error(`Error serving music5000 worklet: ${error.message}`);
-                        res.statusCode = 500;
-                        res.end(`Error serving worklet: ${error.message}`);
+                        handleError(res, `Error serving worklet ${workletName}`, error);
                     }
                     return;
                 }
@@ -239,8 +231,6 @@ export default function jsbeebWorkletPlugin() {
                 // Otherwise continue with the next middleware
                 next();
             });
-
-            // No need for extra watchers - Vite's HMR will trigger transform hooks automatically
         },
     };
 }
diff --git a/package-lock.json b/package-lock.json
index c5e065a..2178fa2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
         "base2048": "^2.0.2",
         "jquery": "^3.7.1",
         "jsbeeb": "github:mattgodbolt/jsbeeb#77be55899c28223d964493c9ad8b60b1ffd37185",
+        "mime-types": "^3.0.1",
         "monaco-editor": "^0.52.2",
         "promise": "^8.3.0",
         "resize-observer-polyfill": "^1.5.1",
@@ -4478,6 +4479,27 @@
         "node": ">=4"
       }
     },
+    "node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.1.tgz",
+      "integrity": "sha512-xRc4oEhT6eaBpU1XF7AjpOFD+xQmXNB5OVKwp4tqCuBpHLS/ZbBDrc07mYTDqVMg6PfxUjjNp85O6Cd2Z/5HWA==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "^1.54.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/mimic-fn": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-4.0.0.tgz",
diff --git a/package.json b/package.json
index a69c30c..1535e55 100644
--- a/package.json
+++ b/package.json
@@ -27,6 +27,7 @@
     "base2048": "^2.0.2",
     "jquery": "^3.7.1",
     "jsbeeb": "github:mattgodbolt/jsbeeb#77be55899c28223d964493c9ad8b60b1ffd37185",
+    "mime-types": "^3.0.1",
     "monaco-editor": "^0.52.2",
     "promise": "^8.3.0",
     "resize-observer-polyfill": "^1.5.1",

From 874688b5f0c605a8188d8e8917d01f262ebd515e Mon Sep 17 00:00:00 2001
From: Matt Godbolt <matt@godbolt.org>
Date: Mon, 21 Apr 2025 21:41:37 -0500
Subject: [PATCH 6/8] Further simplification

---
 jsbeeb-worklet-middleware.js | 24 ------------------
 src/smoothie-shim.js         | 47 ------------------------------------
 vite.config.js               | 10 --------
 3 files changed, 81 deletions(-)
 delete mode 100644 src/smoothie-shim.js

diff --git a/jsbeeb-worklet-middleware.js b/jsbeeb-worklet-middleware.js
index f126bc9..be1774a 100644
--- a/jsbeeb-worklet-middleware.js
+++ b/jsbeeb-worklet-middleware.js
@@ -83,8 +83,6 @@ export default function jsbeebWorkletPlugin() {
             // The global 'sampleRate' and 'currentTime' variables are expected in worklets
             const preamble = `
         // Worklet environment setup for development mode
-        const sampleRate = 44100;  // Default sample rate for most audio contexts
-        const currentTime = globalThis.currentTime || 0;
       `;
 
             const result = await build({
@@ -101,8 +99,6 @@ export default function jsbeebWorkletPlugin() {
                 define: {
                     "process.env.NODE_ENV": '"development"',
                 },
-                // Add any necessary external modules
-                external: ["smoothie"],
             });
 
             // Serve the compiled result
@@ -133,10 +129,6 @@ export default function jsbeebWorkletPlugin() {
                         `const music5000WorkletUrl = new URL("../music5000-worklet.js", import.meta.url).href;`,
                         `// Modified by worklet middleware for dev mode
              const music5000WorkletUrl = "/jsbeeb-worklets/music5000-worklet.js";`,
-                    )
-                    .replace(
-                        `import { SmoothieChart, TimeSeries } from "smoothie";`,
-                        `import { SmoothieChart, TimeSeries } from "/src/smoothie-shim.js";`,
                     );
             }
 
@@ -167,27 +159,11 @@ export default function jsbeebWorkletPlugin() {
                 if (
                     pathname.includes("jsbeeb") ||
                     pathname.includes("worklet") ||
-                    pathname.includes("smoothie") ||
                     pathname.includes("sounds/")
                 ) {
                     console.log(`[jsbeeb-worklet-middleware] Request: ${pathname}`);
                 }
 
-                // Check for smoothie.js import
-                if (pathname.includes("smoothie.js")) {
-                    console.log(`[jsbeeb-worklet-middleware] Intercepting smoothie.js`);
-                    const shimPath = resolve(".", "src/smoothie-shim.js");
-
-                    try {
-                        const content = fs.readFileSync(shimPath, "utf8");
-                        res.setHeader("Content-Type", "application/javascript");
-                        res.end(content);
-                    } catch (error) {
-                        handleError(res, "Error serving smoothie shim", error);
-                    }
-                    return;
-                }
-
                 // Handle sound file requests with a general pattern
                 if (pathname.startsWith("/sounds/")) {
                     // Map the URL path to the corresponding file in jsbeeb node_modules
diff --git a/src/smoothie-shim.js b/src/smoothie-shim.js
deleted file mode 100644
index d88a9f9..0000000
--- a/src/smoothie-shim.js
+++ /dev/null
@@ -1,47 +0,0 @@
-/**
- * Development-only shim for smoothie.js
- *
- * This file provides mock implementations of SmoothieChart and TimeSeries
- * to avoid issues with module format compatibility in development mode.
- */
-
-// Fake implementations that provide just enough functionality for development
-export class SmoothieChart {
-    constructor(options = {}) {
-        this.options = options;
-        this.series = [];
-        console.log("Using mock SmoothieChart for development");
-    }
-
-    addTimeSeries(series, options = {}) {
-        this.series.push({series, options});
-    }
-
-    // eslint-disable-next-line no-unused-vars
-    streamTo(canvas, delay = 100) {
-        // No-op in development
-    }
-
-    static timeFormatter(date) {
-        const hours = date.getHours().toString().padStart(2, "0");
-        const minutes = date.getMinutes().toString().padStart(2, "0");
-        const seconds = date.getSeconds().toString().padStart(2, "0");
-        return `${hours}:${minutes}:${seconds}`;
-    }
-}
-
-export class TimeSeries {
-    constructor() {
-        this.data = [];
-    }
-
-    append(time, value) {
-        this.data.push({time, value});
-    }
-}
-
-// Also provide default export for compatibility
-export default {
-    SmoothieChart,
-    TimeSeries,
-};
diff --git a/vite.config.js b/vite.config.js
index f65e2b6..8e6c66f 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -68,16 +68,6 @@ export default defineConfig({
         port: 8080,
     },
 
-    // Add this resolve section to directly alias problematic imports
-    resolve: {
-        alias: [
-            // Alias the smoothie package to our shim
-            {
-                find: "smoothie",
-                replacement: resolve(__dirname, "src/smoothie-shim.js"),
-            },
-        ],
-    },
     optimizeDeps: {
         // Explicitly exclude the worklet files from optimization
         // This is critical as worklets need to be separate files

From b5bb7aff66606ad8a799ace77824784ad0d59447 Mon Sep 17 00:00:00 2001
From: Matt Godbolt <matt@godbolt.org>
Date: Mon, 21 Apr 2025 21:53:03 -0500
Subject: [PATCH 7/8] Simplification

---
 jsbeeb-worklet-middleware.js | 52 +-----------------------------------
 package-lock.json            | 22 ---------------
 package.json                 |  1 -
 vite.config.js               |  7 +----
 4 files changed, 2 insertions(+), 80 deletions(-)

diff --git a/jsbeeb-worklet-middleware.js b/jsbeeb-worklet-middleware.js
index be1774a..d72941d 100644
--- a/jsbeeb-worklet-middleware.js
+++ b/jsbeeb-worklet-middleware.js
@@ -3,15 +3,11 @@
 import {build} from "esbuild";
 import {resolve} from "path";
 import fs from "fs";
-import mime from "mime-types";
 
 // Path to jsbeeb in node_modules
 // Using '.' is more reliable than process.cwd() and avoids ESLint errors
 const jsbeebPath = resolve(".", "node_modules/jsbeeb");
 
-// Base path to jsbeeb sound files
-const jsbeebSoundsPath = resolve(jsbeebPath, "public/sounds");
-
 // Create Vite plugin
 export default function jsbeebWorkletPlugin() {
     console.log("Initializing jsbeeb worklet middleware plugin");
@@ -29,36 +25,6 @@ export default function jsbeebWorkletPlugin() {
         res.end(`${message}: ${error.message}`);
     }
 
-    // Helper function to serve sound files
-    function serveSound(soundPath, res) {
-        try {
-            // Ensure the sound file exists
-            if (!fs.existsSync(soundPath)) {
-                handleError(
-                    res,
-                    `Sound file not found: ${soundPath}`,
-                    {message: "File not found"},
-                    404,
-                );
-                return;
-            }
-
-            console.log(`[jsbeeb-worklet-middleware] Serving sound file from: ${soundPath}`);
-
-            // Read the sound file as binary
-            const soundData = fs.readFileSync(soundPath);
-
-            // Determine content type based on file extension
-            const contentType = mime.lookup(soundPath) || "application/octet-stream";
-
-            res.setHeader("Content-Type", contentType);
-            res.setHeader("Content-Length", soundData.length);
-            res.end(soundData);
-        } catch (error) {
-            handleError(res, "Error serving sound file", error);
-        }
-    }
-
     // Helper function to build and serve a worklet
     async function serveWorklet(sourcePath, res) {
         try {
@@ -156,26 +122,10 @@ export default function jsbeebWorkletPlugin() {
                 const pathname = parsedUrl.pathname;
 
                 // Log all relevant requests for debugging
-                if (
-                    pathname.includes("jsbeeb") ||
-                    pathname.includes("worklet") ||
-                    pathname.includes("sounds/")
-                ) {
+                if (pathname.includes("jsbeeb") || pathname.includes("worklet")) {
                     console.log(`[jsbeeb-worklet-middleware] Request: ${pathname}`);
                 }
 
-                // Handle sound file requests with a general pattern
-                if (pathname.startsWith("/sounds/")) {
-                    // Map the URL path to the corresponding file in jsbeeb node_modules
-                    const soundPath = resolve(
-                        jsbeebSoundsPath,
-                        pathname.substring("/sounds/".length),
-                    );
-                    console.log(`[jsbeeb-worklet-middleware] Serving sound file: ${pathname}`);
-                    serveSound(soundPath, res);
-                    return;
-                }
-
                 // Extract worklet name from URL path for various patterns
                 let workletName = null;
 
diff --git a/package-lock.json b/package-lock.json
index 2178fa2..c5e065a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,7 +12,6 @@
         "base2048": "^2.0.2",
         "jquery": "^3.7.1",
         "jsbeeb": "github:mattgodbolt/jsbeeb#77be55899c28223d964493c9ad8b60b1ffd37185",
-        "mime-types": "^3.0.1",
         "monaco-editor": "^0.52.2",
         "promise": "^8.3.0",
         "resize-observer-polyfill": "^1.5.1",
@@ -4479,27 +4478,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/mime-db": {
-      "version": "1.54.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
-      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/mime-types": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.1.tgz",
-      "integrity": "sha512-xRc4oEhT6eaBpU1XF7AjpOFD+xQmXNB5OVKwp4tqCuBpHLS/ZbBDrc07mYTDqVMg6PfxUjjNp85O6Cd2Z/5HWA==",
-      "license": "MIT",
-      "dependencies": {
-        "mime-db": "^1.54.0"
-      },
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
     "node_modules/mimic-fn": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-4.0.0.tgz",
diff --git a/package.json b/package.json
index 1535e55..a69c30c 100644
--- a/package.json
+++ b/package.json
@@ -27,7 +27,6 @@
     "base2048": "^2.0.2",
     "jquery": "^3.7.1",
     "jsbeeb": "github:mattgodbolt/jsbeeb#77be55899c28223d964493c9ad8b60b1ffd37185",
-    "mime-types": "^3.0.1",
     "monaco-editor": "^0.52.2",
     "promise": "^8.3.0",
     "resize-observer-polyfill": "^1.5.1",
diff --git a/vite.config.js b/vite.config.js
index 8e6c66f..e189f8a 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -38,7 +38,7 @@ export default defineConfig({
                     },
                 },
                 {
-                    src: "node_modules/jsbeeb/public/sounds/**/*.wav",
+                    src: "node_modules/jsbeeb/public/sounds/**/*",
                     dest: "sounds",
                 },
             ],
@@ -68,11 +68,6 @@ export default defineConfig({
         port: 8080,
     },
 
-    optimizeDeps: {
-        // Explicitly exclude the worklet files from optimization
-        // This is critical as worklets need to be separate files
-        exclude: ["jsbeeb/src/web/audio-renderer.js", "jsbeeb/src/music5000-worklet.js"],
-    },
     css: {
         devSourcemap: true,
         preprocessorOptions: {

From 947007415aa26bfe0ffdd818a31553fe4eaf4bf6 Mon Sep 17 00:00:00 2001
From: Matt Godbolt <matt@godbolt.org>
Date: Mon, 21 Apr 2025 22:18:30 -0500
Subject: [PATCH 8/8] Finally working!

---
 jsbeeb-worklet-middleware.js |   2 +-
 vite.config.js               | 116 ++++++++++++++++++-----------------
 2 files changed, 61 insertions(+), 57 deletions(-)

diff --git a/jsbeeb-worklet-middleware.js b/jsbeeb-worklet-middleware.js
index d72941d..a53e6bb 100644
--- a/jsbeeb-worklet-middleware.js
+++ b/jsbeeb-worklet-middleware.js
@@ -82,7 +82,7 @@ export default function jsbeebWorkletPlugin() {
         transform(code, id) {
             // Look for specific modules to transform
             if (id.includes("jsbeeb/src/web/audio-handler.js")) {
-                console.log(`[transform] Transforming audio-handler.js`);
+                console.log(`[transform] Transforming audio-handler.js for development mode`);
 
                 // Replace the problematic imports and fix audio context for development mode
                 return code
diff --git a/vite.config.js b/vite.config.js
index e189f8a..decd423 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -11,69 +11,73 @@ import jsbeebWorkletPlugin from "./jsbeeb-worklet-middleware.js";
 // Get the directory name equivalent in ESM
 const __dirname = fileURLToPath(new URL(".", import.meta.url));
 
-export default defineConfig({
-    plugins: [
-        // Add our custom middleware for jsbeeb worklets
-        jsbeebWorkletPlugin(),
-        monacoEditorPlugin({}),
-        nodePolyfills(),
-        yaml(),
-        createHtmlPlugin({
-            inject: {
-                data: {
-                    injectAnalytics: true,
-                    analytics: {
-                        path: resolve(__dirname, "src/analytics.html"),
+export default defineConfig(({command}) => {
+    const isDev = command === "serve";
+
+    return {
+        plugins: [
+            // Add our custom middleware for jsbeeb worklets in development mode only
+            isDev && jsbeebWorkletPlugin(),
+            monacoEditorPlugin({}),
+            nodePolyfills(),
+            yaml(),
+            createHtmlPlugin({
+                inject: {
+                    data: {
+                        injectAnalytics: true,
+                        analytics: {
+                            path: resolve(__dirname, "src/analytics.html"),
+                        },
                     },
                 },
-            },
-        }),
-        viteStaticCopy({
-            targets: [
-                {
-                    src: "node_modules/jsbeeb/public/roms/**/*",
-                    dest: "roms",
-                    globOptions: {
-                        ignore: ["**/*.txt", "**/*README*"],
+            }),
+            viteStaticCopy({
+                targets: [
+                    {
+                        src: "node_modules/jsbeeb/public/roms/**/*",
+                        dest: "roms",
+                        globOptions: {
+                            ignore: ["**/*.txt", "**/*README*"],
+                        },
+                    },
+                    {
+                        src: "node_modules/jsbeeb/public/sounds/**/*",
+                        dest: "sounds",
+                    },
+                ],
+            }),
+        ].filter(Boolean),
+        assetsInclude: ["**/*.ttf", "**/*.rom"],
+        build: {
+            // This setting is critical for worklets to work correctly
+            // It prevents worklet files from being inlined which would break them
+            assetsInlineLimit: 0,
+            outDir: "dist",
+            minify: true,
+            sourcemap: true,
+            chunkSizeWarningLimit: 5000,
+            rollupOptions: {
+                external: ["electron"],
+                output: {
+                    manualChunks: {
+                        vendor: ["jquery", "underscore"],
+                        monaco: ["monaco-editor"],
+                        jsbeeb: ["jsbeeb"],
                     },
-                },
-                {
-                    src: "node_modules/jsbeeb/public/sounds/**/*",
-                    dest: "sounds",
-                },
-            ],
-        }),
-    ],
-    assetsInclude: ["**/*.ttf", "**/*.rom"],
-    build: {
-        // This setting is critical for worklets to work correctly
-        // It prevents worklet files from being inlined which would break them
-        assetsInlineLimit: 0,
-        outDir: "dist",
-        minify: true,
-        sourcemap: true,
-        chunkSizeWarningLimit: 5000,
-        rollupOptions: {
-            external: ["electron"],
-            output: {
-                manualChunks: {
-                    vendor: ["jquery", "underscore"],
-                    monaco: ["monaco-editor"],
-                    jsbeeb: ["jsbeeb"],
                 },
             },
         },
-    },
-    server: {
-        port: 8080,
-    },
+        server: {
+            port: 8080,
+        },
 
-    css: {
-        devSourcemap: true,
-        preprocessorOptions: {
-            less: {
-                javascriptEnabled: true,
+        css: {
+            devSourcemap: true,
+            preprocessorOptions: {
+                less: {
+                    javascriptEnabled: true,
+                },
             },
         },
-    },
+    };
 });