@microscope-js/renderer-audio

Audio renderer for microscope-js. A tiny wrapper around the browser's native <audio> element with controls — sub-kilobyte runtime.

Install

pnpm add @microscope-js/renderer-audio

Use

import { createRegistry, mount } from '@microscope-js/core';
import { audioRenderer } from '@microscope-js/renderer-audio';

const registry = createRegistry([audioRenderer]);
await mount({
  source: file,
  container,
  registry,
  options: { autoplay: false, loop: false, muted: false },
});

Options

| Option | Default | Description | | ----------- | ------- | ---------------------------------------- | | autoplay | false | Start playback as soon as it's ready | | loop | false | Restart on ended | | muted | false | Start muted |

Format support

| Extension | MIME | | ---------------------------------------------- | ---------------- | | .mp3 | audio/mpeg | | .wav | audio/wav | | .ogg / .oga | audio/ogg | | .flac | audio/flac | | .aac / .m4a | audio/aac | | .opus | audio/opus | | .weba | audio/webm |

Decoding is entirely the browser's responsibility — codec support matches your target browsers exactly.

Security

• The source is wrapped in a blob: URL revoked on destroy().
• No HTML is built from the source.
• The element is paused and src is cleared on teardown so the file is released.

See also

• @microscope-js/renderer-video — sibling native-element renderer (shares the renderNativeMedia helper)
• @microscope-js/react — React adapter
• Repository · Live demo · API docs

License

MIT