My problem is that the memory usage of my application increases every time I render a pdf file with viewer.js.

I render my pdf this way:

container = document.getElementById('viewerContainer');
viewer = document.getElementById('viewer');

pdfViewer = new PDFViewer({
    container: container,
    viewer: viewer
});

$scope.pdfFindController = new PDFFindController({
      pdfViewer: pdfViewer
});

pdfViewer.setFindController($scope.pdfFindController);

container.addEventListener('pagesinit', function () {
    pdfViewer.currentScaleValue = 'page-width';                            
});

PDFJS.getDocument($scope.getPageLink(pdf)).then(function (pdfDocument) {
    documentPdf = pdfDocument;
    pdfViewer.setDocument(pdfDocument);                       
});

I render the file in a separate view. When I go back to my previous view and open another file, the memory usage increases by ~20MB.

I tried this:

documentPdf.destroy();

Now, the memory usage decreases a bit, but not as much as it was allocated before.

Is there a solution for this?

UPDATE:

Pdf.js version: 1.6.210

pdf.js worker version: 1.6.210

My problem is that the memory usage of my application increases every time I render a pdf file with viewer.js.

I render my pdf this way:

container = document.getElementById('viewerContainer');
viewer = document.getElementById('viewer');

pdfViewer = new PDFViewer({
    container: container,
    viewer: viewer
});

$scope.pdfFindController = new PDFFindController({
      pdfViewer: pdfViewer
});

pdfViewer.setFindController($scope.pdfFindController);

container.addEventListener('pagesinit', function () {
    pdfViewer.currentScaleValue = 'page-width';                            
});

PDFJS.getDocument($scope.getPageLink(pdf)).then(function (pdfDocument) {
    documentPdf = pdfDocument;
    pdfViewer.setDocument(pdfDocument);                       
});

I render the file in a separate view. When I go back to my previous view and open another file, the memory usage increases by ~20MB.

I tried this:

documentPdf.destroy();

Now, the memory usage decreases a bit, but not as much as it was allocated before.

Is there a solution for this?

UPDATE:

Pdf.js version: 1.6.210

pdf.js worker version: 1.6.210

• javascript
• angularjs
• pdf
• memory
• pdf.js

• Make sure you measure memory after garbage collection was run. (Some browsers can force to GC via their tools to do that). It's remended to use the same PDFWorker is you are trying to use multiple docs on the same page. documentPdf.destroy(); is right step. If you don't re-use the same pdfViewer for setDocument, make sure you cleanup all refs to the old one including pdfFindController. – async5 Commented Nov 30, 2016 at 15:12
• There is no angularjs package available from pdfjs project. It's hard to tell or reproduce if no plete example is provided or the package (vendor) used are mentioned. – async5 Commented Nov 30, 2016 at 15:27
• I use Xcode to see the memory usage. Because I build it for iOS. The PDFWorker should be the same. I just set the reference every time PDFJS.workerSrc = 'lib/pdfviewer/pdf.worker.js';. I deleted and set the variables like Giovazz89 remended. Could it be that viewer.js /pdf.js still has some references? Actually, they should be overwritten and I destroy the document in that file, too. Is it possible to clear all variables in one file? – chocolate cake Commented Dec 1, 2016 at 8:53
• Looks like the issue with iOS. Do you see the same issue on a regular browser? You did not publish Minimal, Complete, and Verifiable example -- this might help to troubleshot your solution. – async5 Commented Dec 1, 2016 at 14:28
• It's a bit plicated. I can't start it in my browser, because my app needs another app to work. Unfortunately, I do not have time to build an example. I'll try but I can't promise. – chocolate cake Commented Dec 1, 2016 at 14:59

2 Answers 2

You need to call the destroy method on the promise of the DocumentPageProxy.

The documentation describes it as followed:

Destroys current document instance and terminates worker.

Source: https://github./mozilla/pdf.js/blob/master/src/display/api.js (Line 621)

There are some tests in the current pdf.js library, which tests the behaviour of the destroy method. (https://github./mozilla/pdf.js/blob/master/test/unit/api_spec.js (Line 86)

In your case something like:

 // a variable to store the callback function
 var loadingTask = PDFJS.getDocument(basicApiUrl);
 
...

 // when the document should get destroyed call
 loadingTask.destroy();
 

I think that by calling documentPdf.destroy(); you don't free the memory taken by pdfViewer: I didn't find any methods to destroy pdfViewer, but you can try to call

delete pdfViewer;
delete documentPdf;

and if you are not confident that deleting properties is enough, you can set both to null.

If you still experience memory leaks it can be that the HTML stored in the history cache is using up your memory, so try to replace the viewer or container HTML with an empty element (or remove it pletely)

document.getElementById('viewerContainer').outerHTML = '';

or

container.parentNode.removeChild(container);