ParaPDF

←

–

→−

75%

+

Links, an outline, and formulas. Source: The LaTeX Project (license). Open the full demo for search, thumbnails, annotations, and your own files.

npm install parapdf

import { PdfDocument, PdfViewport } from "parapdf";

export function App() {
  return (
    <PdfDocument source="/manual.pdf">
      <PdfViewport style={{ height: "100vh" }} />
    </PdfDocument>
  );
}

That is all the setup: ParaPDF ships pdf.js, its worker, and the files it loads on demand, and your bundler serves them from your application’s origin.

React stays out of the hot path

Scrolling and zooming commit no React state per frame. React renders only when the set of mounted pages or the current page changes, and pixels reach canvases through refs.

Only what is near the viewport exists

Pages outside a small window unmount and give their canvas memory back. Each page draws a quick base first and full resolution once scrolling settles, within pixel budgets you can set.

A real document

Selectable text that screen readers read, in the structure a tagged PDF gives it; whole-document search, CJK text included; links, the outline, and back and forward.

What a document viewer does

Fillable forms that save into the PDF, annotations, layers, attachments, thumbnails, printing, spreads, scroll modes, encrypted documents, and selections in PDF coordinates.

ParaPDF is at 0.x: its API may change in any minor release until 1.0. The changelog lists every release, and Performance the measurements behind the design, losses included.