@microscope-js/renderer-pdf

PDF renderer for microscope-js, powered by pdfjs-dist v5. All parsing + canvas painting happens inside a Web Worker — the main thread stays responsive.

Install

pnpm add @microscope-js/renderer-pdf

pdfjs-dist is a real dependency (not a peer) so consumers get a deduplicated copy.

Use

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

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

// renderer-specific capabilities
const cap = handle.capabilities as { pageCount: number; scrollToPage(n: number): void };
console.log(cap.pageCount);
cap.scrollToPage(42);

Options

Pass via mount({ options: { … } }) or <Viewer options={{ … }} />.

| Option | Default | Description | | ------------ | -------------------- | ------------------------------------------------------ | | maxBytes | 256 * 1024 * 1024 | Reject PDFs larger than this (MicroscopeError('TOO_LARGE')) | | maxPages | 5000 | Cap pages rendered — defends against PDF bombs | | scale | 1.25 | Canvas render scale (also DPR-aware for crisp text) | | workerSrc | bundled | Override pdf.worker.mjs URL (e.g. self-host on CDN) |

Capabilities exposed on the RenderHandle

interface PdfHandle extends RenderHandle {
  readonly capabilities: {
    pageCount: number;
    scrollToPage(n: number): void;
  };
}

Security model

• pdfjs v5 disables runtime JS evaluation by default — no eval-style path is ever taken.
• disableAutoFetch: true — never re-fetches over the network during render.
• All rendering happens in the user's browser. The PDF byte stream never leaves the tab.
• The worker is sandboxed to its own thread; a malformed PDF can't read the main page's DOM or globals.
• maxBytes / maxPages defaults defend against pathological inputs ("PDF bombs").

Bundle notes

The pdfjs worker is loaded via new URL('pdfjs-dist/build/pdf.worker.mjs', import.meta.url). Webpack 5, Vite, and Next.js handle that asset-module pattern out of the box. If you ship behind a CDN, pass options.workerSrc to point at your own hosted copy.

See also

• @microscope-js/react — <Viewer /> for React / Next.js
• @microscope-js/core — the registry that picks this renderer
• Repository · Live demo · API docs

License

MIT