Skip to content

Commit

Permalink
Update docs
Browse files Browse the repository at this point in the history
  • Loading branch information
hyzyla committed Sep 1, 2024
1 parent 11e5257 commit 49215c3
Show file tree
Hide file tree
Showing 6 changed files with 74 additions and 21 deletions.
5 changes: 3 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,18 @@

📃 [Documentation](https://pdfium.js.org/docs/intro)

Node.js wrapper for the PDFium library:
TypeScript/JavaScript wrapper for the PDFium library:

- ⬇️ [pdfium](https://pdfium.googlesource.com/pdfium/) - source code of the PDFium library, developed by Google and used in Chrome.
- ⬇️ [pdfium-lib](https://github.com/paulocoutinhox/pdfium-lib) - project to compile PDFium library to multiple platforms, including WebAssembly.
- 📍 [@hyzyla/pdfium](https://github.com/hyzyla/pdfium) - (you are here)
Node.js wrapper for the WebAssembly build of PDFium library.
TypeScript/JavaScript wrapper for the WebAssembly build of PDFium library.

# Features
- 📦 Zero dependencies - PDFium library is compiled to WebAssembly and bundled with the package.
- 🚀 Fast - PDFium can be faster than PDF.js, because it's originally written in C++ and compiled to WebAssembly, while PDF.js is entirely written in JavaScript.
- 🔒 Type-safe - TypeScript definitions are included.
- 🗼 Works in browser and Node.js

## Installation

Expand Down
7 changes: 5 additions & 2 deletions demo/vite/src/demo.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { type PDFiumDocument, PDFiumLibrary } from "@hyzyla/pdfium/browser/cdn";
import { type PDFiumDocument, PDFiumLibrary } from "@hyzyla/pdfium";
import wasmUrl from "@hyzyla/pdfium/pdfium.wasm?url";
import { useQuery } from "@tanstack/react-query";
import { useEffect, useRef } from "react";

Expand All @@ -8,7 +9,9 @@ const useDocument = () => {
queryFn: async () => {
const response = await fetch("/sample.pdf");
const arrayBuffer = await response.arrayBuffer();
const library = await PDFiumLibrary.init({});
const library = await PDFiumLibrary.init({
wasmUrl: wasmUrl,
});
const document = await library.loadDocument(new Uint8Array(arrayBuffer));
return document;
},
Expand Down
9 changes: 4 additions & 5 deletions docs/docs/01-intro.md
Original file line number Diff line number Diff line change
@@ -1,24 +1,23 @@
# Introduction

@hyzyla/pdfium is a Node.js wrapper for the [PDFium](https://pdfium.googlesource.com/pdfium/) library:
@hyzyla/pdfium is a TypeScript/JavaScript wrapper for the [PDFium](https://pdfium.googlesource.com/pdfium/) library:

- ⬇️ [pdfium](https://pdfium.googlesource.com/pdfium/) - an open-source library for PDF manipulation and rendering, developed by Google and used in Google Chrome browser.
- ⬇️ [pdfium-lib](https://github.com/paulocoutinhox/pdfium-lib) - project by [Paulo Coutinho](https://github.com/paulocoutinhox) to compile PDFium library to multiple platforms, including WebAssembly.
- 📍 [@hyzyla/pdfium](https://github.com/hyzyla/pdfium) - (you are here) Node.js wrapper for the WebAssembly build of PDFium library.
- 📍 [@hyzyla/pdfium](https://github.com/hyzyla/pdfium) - (you are here) TypeScript/JavaScript wrapper for the WebAssembly build of PDFium library.

# Features

- 📦 **Zero dependencies** - PDFium library is compiled to WebAssembly and bundled with the package.
- 🚀 **Fast** - PDFium can be faster than [PDF.js](https://mozilla.github.io/pdf.js/), because it's
originally written in C++ and compiled to WebAssembly, while PDF.js is entirely written in JavaScript.
- 🔒 **Type-safe** - TypeScript definitions are included.
- 🗼 **Works in browser and Node.js**

# Use cases

Main use case for this library is to render PDF files to images, but if you need to do something else with PDF files that is supported by PDFium, but not included in this library, feel free to open an issue or a pull request on
[GitHub](https://github.com/hyzyla/pdfium).

Examples how to render PDF files to images can be found on 👉 ["Render PDF to image"](/docs/02-render-pdf.md) page.
Examples how to render PDF files to images can be found on 👉 ["Render PDF to image"](/docs/03-render-pdf.md) page.

# Installation

Expand Down
62 changes: 62 additions & 0 deletions docs/docs/02-init-library.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
# Initialize Library

Before working with the package, you need to create an instance of PDFiumLibrary. You can do this once for the entire application and reuse the library instance throughout the application's lifetime.



```typescript
import { PDFiumLibrary } from '@hyzyla/pdfium';

const library = await PDFiumLibrary.init();

// ... do something with the library

library.destroy();
```


## Node.js

For Node.js, there is no need to provide any additional settings to load the .wasm file; it will be automatically loaded from your `node_modules` folder.

```typescript
import { PDFiumLibrary } from '@hyzyla/pdfium';

const library = await PDFiumLibrary.init();
```

## Browser

In the browser, you need to provide the URL to the `.wasm` binary or an `ArrayBuffer` of the `.wasm` binary as an argument to the init method. Typically, you will use a bundler like Webpack or Rollup, which allows you to import the `.wasm` file directly as an asset URL. Here is an example of how you can do this with Rollup:

```typescript
import { PDFiumLibrary } from "@hyzyla/pdfium/browser/cdn";
import wasmUrl from "@hyzyla/pdfium/pdfium.wasm?url"; // URL to the .wasm file

const library = await PDFiumLibrary.init({
wasmUrl: wasmUrl,
});
```

:::info
This method is recommended for production use, as it allows you to load the .wasm file from your own servers without any additional overhead.
:::

## Browser - quick setup

If you need to quickly test the library in the browser, you can use special entry points that load the `.wasm` file from a CDN or from a base64-encoded string. This approach is not recommended for production use, as it may introduce additional overhead and security risks, but it can be useful for quick testing and prototyping.

#### Load .wasm from CDN (security risk and slower loading):
```typescript
import { PDFiumLibrary } from "@hyzyla/pdfium/browser/cdn";

const library = await PDFiumLibrary.init();
```

#### Load .wasm from base64 encoded string (bigger bundle size):
```typescript
import { PDFiumLibrary } from "@hyzyla/pdfium/browser/base64";

const library = await PDFiumLibrary.init();
```

12 changes: 0 additions & 12 deletions docs/docs/02-render-pdf.md → docs/docs/03-render-pdf.md
Original file line number Diff line number Diff line change
@@ -1,18 +1,6 @@
# Render PDF to image

## Load PDFiumLibrary

First of all, you need to create an instance of PDFiumLibrary. You can do this once for the whole application and reuse the library instance during the application lifetime.

```typescript
import { PDFiumLibrary } from '@hyzyla/pdfium';

const library = await PDFiumLibrary.init();

// ... do something with the library

library.destroy();
```

## Load PDF document

Expand Down
File renamed without changes.

0 comments on commit 49215c3

Please sign in to comment.