Virtual Renderer

For large documents, VirtualRenderer only renders pages visible in the viewport — like a virtualized list for PDFs.

import { VirtualRenderer } from "pdfnova/lite";

Setup

const renderer = new VirtualRenderer({
  container: document.getElementById("viewer")!,
  scale: 1.5,
  overscan: 2,     // pre-render 2 pages above/below viewport
  cacheSize: 10,   // LRU cache keeps 10 rendered pages in memory
  gap: 8,          // 8px gap between pages
});

await renderer.setDocument(doc);

Navigation

// Jump to a specific page
renderer.scrollToPage(5);

// Get current visible page
const currentPage = renderer.getCurrentPage();

Options

Option	Type	Default	Description
container	HTMLElement	required	Scrollable container element
scale	number	1	Render scale
overscan	number	1	Pages to render outside viewport
cacheSize	number	5	LRU cache size for rendered canvases
gap	number	0	Gap between pages in pixels

How It Works

1. Listens to the container's scroll events
2. Calculates which pages are visible (plus overscan)
3. Renders only those pages, reusing cached canvases
4. Removes off-screen pages from the DOM (but keeps them in the LRU cache)

This keeps memory usage constant regardless of document size — a 1,000-page PDF uses the same memory as a 10-page one.