Production builds
Alias the package to the no-op build (about 6 KB gzip, or 9 KB if you use ramps and curves). params() still returns your defaults and add().value still reads through, so app code is unchanged. Each no-op entry exports every name its real entry does (defineExtension and the three codecs included), so an aliased build compiles as it is:
// esbuild
alias: { '@haxiomic/devui': '@haxiomic/devui/noop', '@haxiomic/devui/three': '@haxiomic/devui/three/noop' }
// vite.config.js: anchored patterns, so the noop entries themselves aren't aliased again
export default defineConfig(({ command }) => ({
resolve: {
alias: command === 'build' ? [
{ find: /^@haxiomic\/devui$/, replacement: '@haxiomic/devui/noop' },
{ find: /^@haxiomic\/devui\/three$/, replacement: '@haxiomic/devui/three/noop' },
{ find: /^@haxiomic\/devui\/frames$/, replacement: '@haxiomic/devui/frames/noop' },
] : [],
},
}));
@haxiomic/devui/spring needs no alias: it's the spring maths alone, the same in both builds. A spring config in params() is a value in the no-op build too, and takes your saved edits.
Even in development the panel is lazy: about 140 KB gzip loads the first time it shows, on top of about 47 KB of core that loads with your app (a small app, bundled: npm run size in devui). That needs a bundler that splits dynamic imports into chunks, as Vite and Rollup do. With esbuild, set splitting: true (with format: 'esm'): without it, every lazy part is inlined into your start-up bundle, about 800 KB (270 KB gzip) in one app. These load on demand (1–19 KB each):
- the texture inspector, the WebGL and WebGPU backends, plot drawing
- the colour picker, the ramp editor and its tools, curves and the other shape editors (each popover opens once its editor is in, so it's placed for the editor)
- the palette library's data (26 KB), the first time a ramp editor opens
- search results, context menus, the shortcuts sheet and arrange mode
npm run size lists every stage.