Interference between multiple pdf renders when using usePDF

[davbrito]

Describe the bug When using usePDF, and triggering another render on other place of the app, it makes usePDF rerender and regenerate the PDF again.

My guess is that the problem is here: https://github.com/diegomura/react-pdf/blob/a37d927f54d7f367416788979e4b5a8248532952/packages/renderer/src/index.js#L19-L25

The on change listeners always are called, even for renders of other documents, that triggers the queueDocumentRender. Causing an unnecessary pdf rerender. https://github.com/diegomura/react-pdf/blob/a37d927f54d7f367416788979e4b5a8248532952/packages/renderer/src/dom/usePDF.js#L22-L28

Maybe the onChange listeners should be scoped by its pdf instance to avoid this.

To Reproduce Steps to reproduce the behavior including code snippet (if applies):

1. Create a component that displays a pdf with BlobProvider or usePDF
2. Create a button and use the onClick to generate a pdf directly with the pdf API
3. See how the component regenerates the PDF

Expected behavior The generation of another unrelated document should not make the usePDF to rerender.

Desktop (please complete the following information):

• OS: Windows and MacOS
• Browser: Chrome
• React-pdf version @react-pdf/[email protected]

[KalvinWei]

Thanks for bring this up, man. I also find another issue is, if you have many usePdf instances in your page at once. The current setting is the PDFs are all attempted to be rendered at once which will block the DOM rendering, leading significant lagging in user experience. A propose is to expose a function to actually start to the rendering of the pdf, better we also have a state exposed along with the blob, error, url on pdf. You reckon? @davbrito