# PDF.js — Client-Side PDF Rendering in JavaScript

> PDF.js is a general-purpose PDF rendering library built with web standards. Created by Mozilla, it powers Firefox's built-in PDF viewer and can be embedded in any web application.

## Install

Save in your project root:

# PDF.js — Client-Side PDF Rendering in JavaScript

## Quick Use
```bash
npm install pdfjs-dist
```
```javascript
import * as pdfjsLib from 'pdfjs-dist';
const pdf = await pdfjsLib.getDocument('file.pdf').promise;
const page = await pdf.getPage(1);
const viewport = page.getViewport({ scale: 1.5 });
const canvas = document.getElementById('canvas');
await page.render({ canvasContext: canvas.getContext('2d'), viewport }).promise;
```

## Introduction
PDF.js is an open-source JavaScript library maintained by Mozilla that parses and renders PDF files directly in the browser without plugins. It uses HTML5 Canvas and SVG for rendering and works across all modern browsers.

## What PDF.js Does
- Parses PDF documents entirely in JavaScript without native plugins or server rendering
- Renders pages to HTML5 Canvas with high fidelity to the PDF specification
- Provides a full-featured viewer UI with search, thumbnails, and navigation
- Supports annotations, form fields, and embedded fonts
- Extracts text content for accessibility and search indexing

## Architecture Overview
PDF.js consists of a core layer that parses the PDF binary format and a display layer that renders pages. The parser handles cross-reference tables, object streams, encryption, and font subsetting. Rendering runs in a Web Worker by default to keep the UI thread responsive, and the viewer layer provides a complete read-only PDF experience.

## Self-Hosting & Configuration
- Install via npm as `pdfjs-dist` or load from a CDN
- Configure the worker script path via `pdfjsLib.GlobalWorkerOptions.workerSrc`
- Embed the prebuilt viewer HTML in an iframe for a full PDF reading experience
- Customize rendering scale, rotation, and text layer overlays per page
- Works in Node.js environments with `canvas` and `jsdom` for server-side rendering

## Key Features
- Zero-plugin PDF rendering that works in every modern browser
- Web Worker support for non-blocking parsing of large documents
- Built-in viewer with search, print, zoom, and page navigation
- Accessible text layer overlay for screen readers and text selection
- Active development by Mozilla with continuous PDF specification coverage

## Comparison with Similar Tools
- **Adobe Acrobat Reader** — native plugin; PDF.js requires no install
- **react-pdf** — a React wrapper around PDF.js for component-based integration
- **pdf-lib** — focused on creating and modifying PDFs, not rendering
- **PSPDFKit** — commercial viewer with annotation editing; PDF.js is free
- **Google Docs Viewer** — server-side conversion; PDF.js runs entirely client-side

## FAQ
**Q: Does PDF.js support all PDF features?**
A: It covers the vast majority of the PDF specification. Some niche features like 3D annotations or certain encryption schemes may not be supported.

**Q: Can I use PDF.js in a React or Vue project?**
A: Yes. Use the `pdfjs-dist` npm package directly or wrapper libraries like react-pdf.

**Q: Does PDF.js work offline?**
A: Yes, once loaded it needs no network access beyond fetching the PDF file itself.

**Q: How large are the PDF.js assets?**
A: The library plus worker is roughly 400 KB gzipped. The prebuilt viewer adds additional CSS and HTML.

## Sources
- https://github.com/mozilla/pdf.js
- https://mozilla.github.io/pdf.js/

---
Source: https://tokrepo.com/en/workflows/1ad928fe-44f8-11f1-9bc6-00163e2b0d79
Author: AI Open Source