PdfViewer Performance issues inside a dialog

I have implemented the pdfviewer inside a side panel (dialog) and i noticed a considerable slowing in my component when i open the pdfviewer. i used the unload and destroy methods of the pdfviewer inside my ngOnDestory of the dialog but i feel it does not do the job (clean up), and i got this error.


but when i use a function thats call the pdfviewer.destroy() before closing my component it work (it close the pdfviewer), but the performance still the same.


any suggestions, Thanks.


Azeddine.


3 Replies

SK Shamini Kiruba Sobers Syncfusion Team October 28, 2021 12:03 PM UTC

Hi azeddine, 

Greetings from Syncfusion support. 

We were unable to replicate the performance issue at our end with the provided information. The sample we tried at our end can be downloaded from the following link. 



Run the web service and then the sample. 

We are not sure about the exact issue you are facing. Kindly share the modified sample to reproduce the issue and a video screenshot that explains the issue. This will be helpful to investigate further and provide the solution at the earliest. 

Regards, 
Shamini 



AA azeddine assoumati October 28, 2021 04:50 PM UTC

its very complexe to create a simple cause i use a list of document like below

list doc.png

the X open the pdfviewer with the document like below

pdfviewer.PNG

i use a side panel to show the pdfviewer. the side panel uses a dynamic component style to charge the component of the pdfviewer. the application work fine before i open the pdfviewer, but after i open it and close it (do nothing just open it and close it) i feel the lag of scrolling im my page and the down of performance in general. i feel like it does not clean the data and the load of the pdfviewer after closing it. here is my memory profiler when i open the pdfviewer

memory performance.PNG

and after i close it

memory perf after.PNG


the number of DOM nodes is huge i guess thats the problem of the lag in scroll and performance.

how can i destroy all pdfviewer ressources after closing it ? (for information i use the destroy method and i think it does not so the job)

Thanks.



SK Shamini Kiruba Sobers Syncfusion Team October 29, 2021 01:14 PM UTC

Hi azeddine, 

Thanks for the update. 

Regarding the lag of scrolling: 

Initially, we will render the first two pages of the PDF document. Then we will render the remaining pages on demand by scrolling the pages in the PDF Viewer control. Also, in our first AJAX request, we will get some document information and the size of the pages in the PDF document and send it to the client for further process, so there will be some delay while loading the large size documents in the PDF Viewer. So, the loading time depends on the weightage of the content in the PDF document. 

Regarding the issue reported with the destroy method, DOM nodes, and performance: 

We have captured a video while monitoring the performance and highlighted the changes in the DOM nodes during sample loading, waiting time(without loading PDF Viewer), PDF Viewer loading, scrolling, doing some operation, triggering download event, destroying/closing the PDF Viewer, waiting time to clear resources, leaving the page and on returning. Kindly look into the below video screenshot. 


You could see that the DOM Nodes keep on increasing even before opening the PDF Viewer component. And the increases during some operations like scrolling, adding annotation, downloading, etc., are normal. Then after destroying the PDF Viewer, the PDF Viewer component gets destroyed. Sometimes it is not getting updated for a few seconds which seems to be an issue in Chrome as per the discussions in the public forums. But on clicking somewhere in the performance monitor area or after clicking some other app, the values get updated. 

We request you to share a video that shows the performance profiler in cases similar to our video like before opening PDF Viewer, waiting for some time before opening PDF Viewer, after opening and destroying PDF Viewer to assist further. 

Regards, 
Shamini 


Loader.
Up arrow icon