PdfViewer in angular mat dialog has performance issues at open many times

[Benjamin]

Hi, i'm facing performance issues with PdfViewer component inside a mat-dialog component.

In the context, i has like 15 components in a page, and i has a list of files where user can press a button of a entry and the mat-dialog is opened, and this mat-dialog has like child the PdfViewer.

If i open this dialog many times (more than two example), i can note that browser event has lag (as example scrolling is not smooth). 

I think that pdfViewer is not cleaning resources, so i add `pdfViewer.destroy()` but show console errors (parent element is undefined).

So, how i can force clean resources in memory of pdfViewer? is slowing my app performance.

Regards Syncfusioners

[Dhivyabharathi Mohan]

Hi Benjamin, 

  

Thank you for contacting Syncfusion support.  

  

Please find  the details, 

  

Query	Details
Hi, i'm facing performance issues with PdfViewer component inside a mat-dialog component.  In the context, i has like 15 components in a page, and i has a list of files where user can press a button of a entry and the mat-dialog is opened, and this mat-dialog has like child the PdfViewer.     If i open this dialog many times (more than two example), i can note that browser event has lag (as example scrolling is not smooth).	We have checked with the Angular PDF Viewer sample to load the document inside a dialog panel from the grid rows. We were unable to reproduce the reported issue. We have shared the sample and video for your reference.      Sample: https://stackblitz.com/edit/angular-ceqiku-b9pvmc?file=app.component.html      Video: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Grid_and_dialog-1343638547      Could you kindly try the sample and let us know whether you are facing the same issue? If yes, kindly share the video demonstration to replicate this issue. It will be helpful for us to investigate further and provide the details at the earliest.
I think that pdfViewer is not cleaning resources, so i add `pdfViewer.destroy()` but show console errors (parent element is undefined).     So, how i can force clean resources in memory of pdfViewer? is slowing my app performance.	In our PDF Viewer, we can use the unload method to unload the document from the viewer and use the destroy() method to destroy the PDF Viewer. We have shared the sample and code snippet for your reference.     Sample: https://stackblitz.com/edit/angular-ceqiku-b9pvmc?file=app.component.html      Code snippet:     <button (click)="destroy()">destory</button>  <button (click)="unload()">unload</button>  destroy() {      var pdfviewer = (<any>document.getElementById('pdfViewer'))        .ej2_instances[0];      pdfviewer.destroy();    }    unload() {      var pdfviewer = (<any>document.getElementById('pdfViewer'))        .ej2_instances[0];      pdfviewer.unload();    }

  

Kindly try this and revert us, if you have any concerns. 

  

Regards, 

Dhivya.