Merge pull request #1338 from tidalcycles/fix-worklet-bundling

fix: superdough worklets bundling

package.json

@@ -71,6 +71,7 @@
     "jsdoc-json": "^2.0.2",
     "lerna": "^8.1.9",
     "prettier": "^3.4.2",
-    "vitest": "^3.0.4"
+    "vitest": "^3.0.4",
+    "vite-plugin-bundle-audioworklet": "workspace:*"
   }
 }

packages/superdough/package.json

@@ -32,7 +32,8 @@
   },
   "homepage": "https://github.com/tidalcycles/strudel#readme",
   "devDependencies": {
-    "vite": "^6.0.11"
+    "vite": "^6.0.11",
+    "vite-plugin-bundle-audioworklet": "workspace:*"
   },
   "dependencies": {
     "nanostores": "^0.11.3"

packages/superdough/superdough.mjs

@@ -8,7 +8,7 @@ import './feedbackdelay.mjs';
 import './reverb.mjs';
 import './vowel.mjs';
 import { clamp, nanFallback, _mod } from './util.mjs';
-import workletsUrl from './worklets.mjs?worker&url';
+import workletsUrl from './worklets.mjs?audioworklet';
 import { createFilter, gainNode, getCompressor, getWorklet } from './helpers.mjs';
 import { map } from 'nanostores';
 import { logger } from './logger.mjs';

packages/superdough/vite.config.js

@@ -1,10 +1,11 @@
 import { defineConfig } from 'vite';
 import { dependencies } from './package.json';
 import { resolve } from 'path';
+import bundleAudioWorkletPlugin from 'vite-plugin-bundle-audioworklet';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [],
+  plugins: [bundleAudioWorkletPlugin()],
   build: {
     lib: {
       entry: resolve(__dirname, 'index.mjs'),

packages/vite-plugin-bundle-audioworklet/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "vite-plugin-bundle-audioworklet",
+  "main": "./vite-plugin-bundle-audioworklet.js",
+  "version": "0.1.0",
+  "description": "",
+  "keywords": [
+    "vite",
+    "audioworklet"
+  ],
+  "author": "Felix Roos <flix91@gmail.com>",
+  "license": "MIT",
+  "type": "module",
+  "devDependencies": {
+    "vite": "^6.0.11"
+  }
+}

packages/vite-plugin-bundle-audioworklet/vite-plugin-bundle-audioworklet.js

@@ -0,0 +1,48 @@
+import { createLogger, build } from 'vite';
+
+const end = '?audioworklet';
+
+function bundleAudioWorkletPlugin() /* : PluginOption */ {
+  let viteConfig /* : UserConfig */;
+
+  return {
+    name: 'vite-plugin-bundle-audioworklet',
+    /* apply: 'build', */
+    enforce: 'post',
+
+    config(config) {
+      viteConfig = config;
+    },
+
+    async transform(_code, id) {
+      if (!id.endsWith(end)) {
+        return;
+      }
+      const entry = id.replace(end, '');
+      const quietLogger = createLogger();
+      quietLogger.info = () => undefined;
+
+      const output = await build({
+        configFile: false,
+        clearScreen: false,
+        customLogger: quietLogger,
+        build: {
+          lib: {
+            entry,
+            name: '_',
+            formats: ['iife'],
+          },
+          write: false,
+        },
+      });
+      if (!(output instanceof Array)) {
+        throw new Error('Expected output to be Array');
+      }
+      const iife = output[0].output[0].code;
+      const encoded = Buffer.from(iife, 'utf8').toString('base64');
+      return `export default "data:text/javascript;base64,${encoded}";`;
+    },
+  };
+}
+
+export default bundleAudioWorkletPlugin;

pnpm-lock.yaml

@@ -41,7 +41,7 @@ importers:
         version: 2.2.7
       '@vitest/coverage-v8':
         specifier: 3.0.4
-        version: 3.0.4(vitest@3.0.4(@types/debug@4.1.12)(@types/node@22.10.10)(@vitest/ui@3.0.4)(jiti@2.4.2)(lightningcss@1.29.1)(terser@5.37.0)(yaml@2.7.0))
+        version: 3.0.4(vitest@3.0.4)
       '@vitest/ui':
         specifier: ^3.0.4
         version: 3.0.4(vitest@3.0.4)
@@ -75,6 +75,9 @@ importers:
       prettier:
         specifier: ^3.4.2
         version: 3.4.2
+      vite-plugin-bundle-audioworklet:
+        specifier: workspace:*
+        version: link:packages/vite-plugin-bundle-audioworklet
       vitest:
         specifier: ^3.0.4
         version: 3.0.4(@types/debug@4.1.12)(@types/node@22.10.10)(@vitest/ui@3.0.4)(jiti@2.4.2)(lightningcss@1.29.1)(terser@5.37.0)(yaml@2.7.0)
@@ -476,6 +479,9 @@ importers:
       vite:
         specifier: ^6.0.11
         version: 6.0.11(@types/node@22.10.10)(jiti@2.4.2)(lightningcss@1.29.1)(terser@5.37.0)(yaml@2.7.0)
+      vite-plugin-bundle-audioworklet:
+        specifier: workspace:*
+        version: link:../vite-plugin-bundle-audioworklet
 
   packages/tidal:
     dependencies:
@@ -540,6 +546,12 @@ importers:
         specifier: ^3.0.4
         version: 3.0.4(@types/debug@4.1.12)(@types/node@22.10.10)(@vitest/ui@3.0.4)(jiti@2.4.2)(lightningcss@1.29.1)(terser@5.37.0)(yaml@2.7.0)
 
+  packages/vite-plugin-bundle-audioworklet:
+    devDependencies:
+      vite:
+        specifier: ^6.0.11
+        version: 6.0.11(@types/node@22.10.10)(jiti@2.4.2)(lightningcss@1.29.1)(terser@5.37.0)(yaml@2.7.0)
+
   packages/web:
     dependencies:
       '@strudel/core':
@@ -780,6 +792,9 @@ importers:
       sharp:
         specifier: ^0.33.5
         version: 0.33.5
+      vite-plugin-bundle-audioworklet:
+        specifier: workspace:*
+        version: link:../packages/vite-plugin-bundle-audioworklet
       workbox-window:
         specifier: ^7.3.0
         version: 7.3.0
@@ -7561,7 +7576,6 @@ packages:
 
   workbox-google-analytics@7.0.0:
     resolution: {integrity: sha512-MEYM1JTn/qiC3DbpvP2BVhyIH+dV/5BjHk756u9VbwuAhu0QHyKscTnisQuz21lfRpOwiS9z4XdqeVAKol0bzg==}
-    deprecated: It is not compatible with newer versions of GA starting with v4, as long as you are using GAv3 it should be ok, but the package is not longer being maintained
 
   workbox-navigation-preload@7.0.0:
     resolution: {integrity: sha512-juWCSrxo/fiMz3RsvDspeSLGmbgC0U9tKqcUPZBCf35s64wlaLXyn2KdHHXVQrb2cqF7I0Hc9siQalainmnXJA==}
@@ -10248,7 +10262,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@vitest/coverage-v8@3.0.4(vitest@3.0.4(@types/debug@4.1.12)(@types/node@22.10.10)(@vitest/ui@3.0.4)(jiti@2.4.2)(lightningcss@1.29.1)(terser@5.37.0)(yaml@2.7.0))':
+  '@vitest/coverage-v8@3.0.4(vitest@3.0.4)':
     dependencies:
       '@ampproject/remapping': 2.3.0
       '@bcoe/v8-coverage': 1.0.2

vitest.config.mjs

@@ -1,7 +1,9 @@
-import { configDefaults, defineConfig } from 'vitest/config';
+import { defineConfig } from 'vitest/config';
+import bundleAudioWorkletPlugin from 'vite-plugin-bundle-audioworklet';
 
 /// <reference types="vitest" />
 export default defineConfig({
+  plugins: [bundleAudioWorkletPlugin()],
   test: {
     reporters: 'verbose',
     isolate: false,

website/astro.config.mjs

@@ -5,6 +5,7 @@ import remarkToc from 'remark-toc';
 import rehypeSlug from 'rehype-slug';
 import rehypeAutolinkHeadings from 'rehype-autolink-headings';
 import rehypeUrls from 'rehype-urls';
+import bundleAudioWorkletPlugin from 'vite-plugin-bundle-audioworklet';
 
 import tailwind from '@astrojs/tailwind';
 import AstroPWA from '@vite-pwa/astro';
@@ -134,6 +135,7 @@ export default defineConfig({
   site,
   base,
   vite: {
+    plugins: [bundleAudioWorkletPlugin()],
     ssr: {
       // Example: Force a broken package to skip SSR processing, if needed
       // external: ['fraction.js'], // https://github.com/infusion/Fraction.js/issues/51

website/package.json

@@ -73,6 +73,7 @@
     "@vite-pwa/astro": "^0.5.0",
     "html-escaper": "^3.0.3",
     "sharp": "^0.33.5",
-    "workbox-window": "^7.3.0"
+    "workbox-window": "^7.3.0",
+    "vite-plugin-bundle-audioworklet": "workspace:*"
   }
 }