@microscope-js/renderer-image

Image renderer for microscope-js. Uses the browser's native <img> element — sub-kilobyte runtime, every codec your browser already ships.

Install

pnpm add @microscope-js/renderer-image
Copy

Use

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

const registry = createRegistry([imageRenderer]);
await mount({ source: file, container, registry });
Copy

Format support

Browser-native decoding — if your target browsers support a format, this renderer supports it.

Security model

• SVGs are mounted via <img src="blob:…">, not inline. Inline <svg> would let arbitrary <script> and event handlers run; <img>-loaded SVGs are sandboxed by the browser and cannot execute scripts or fetch external resources.
• Object URLs created for the source are revoked on destroy().
• No HTML is built from the source — no DOMPurify needed.

See also

• @microscope-js/renderer-video · @microscope-js/renderer-audio — sibling native-element renderers
• @microscope-js/react — React adapter
• Repository · Live demo · API docs

License

MIT