Angular PDF viewer showcase. Running on Angular 18.2.9 and ngx-extended-pdf-viewer 22.0.0-alpha.6. Choose a version:

Rendering a PDF page takes some time. When you browse quickly through the pages of a complex document, you'll frequently see the loading indicator instead of the page. That's an unpleasant experience, so the PDF viewer renders one or two pages in advance.

While that's a good compromise between energy consumption and user experience in most cases, some users reported they need more flexibility. ngx-extended-pdf-viewer allows you to define a custom pre-rendering strategy. You can use it to render more pages below the current page in advance, but you can also use it to render pages above the currently visible page. The latter is useful to allow quick backward scrolling after jumping to a new chapter or jumping to a new page by entering the page number.

Note that rendering too many pages in advance may have the opposite effect. Keeping your CPU busy results in a slow UI and a bad user experience.

 <ngx-extended-pdf-viewer
    [src]="'./assets/pdfs/The Public Domain - Enclosing the Commons of the Mind.pdf'"
    [zoom]="'page-width'"
    [height]="'auto'"
    [(page)]="page"
    [(pageLabel)]="pageLabel"
    [textLayer]="true"
    (pageRendered)="onPageRendered()">
</ngx-extended-pdf-viewer>
Note there's a bug in the PDF file. See the annotation layer demo to see the bugfix.Copyright hint: the e-book has been published by James Boyle under a CC BY-NC-SA 3.0 on www.thepublicdomain.org.
File name:

-

File size:

-

Title:

-

Author:

-

Subject:

-

Keywords:

-

Creation Date:

-

Modification Date:

-

Creator:

-

PDF Producer:

-

PDF Version:

-

Page Count:

-

Page Size:

-

Fast Web View:

-

Choose an option Alt text (alternative text) helps when people can’t see the image or when it doesn’t load.
Aim for 1-2 sentences that describe the subject, setting, or actions.
This is used for ornamental images, like borders or watermarks.
Preparing document for printing…
0%