šŸ’„ [PLUGIN RELEASE] Advanced Export to PDF: Whole Page / Single Element

Hello again, when I try render in mobile it is not able because long loading time. It take some time loading and after that it show this error: (Translation in bellow)

"Oh no! Something went wrong when viewing this web page. If youā€™are seeing this often, try these suggestions. "

The support article say to clean the cache, close other tabs and refresh page. I already did it and the issue continue.

Perhaps the browser understands this action as wrong, as it takes 1 minute and does not display anything to the user. Perhaps if we have a progress bar, maybe this problem can be solved. What do you think about?

Yes, this should be improved in the next releaseā€¦

Unfortunately, Bubble does not provide us a way to get updated about the uploading process. And since the PDF generation happens on the client side, we have no way to do the upload asynchronouslyā€¦ I will think about it but I donā€™t see any silver bullet solution, unfortunately.

The server-side plugin you posted above can generate a pdf on the server side because it uses a predefined PDF template where it inserts some custom values.

Thatā€™s being said, you may find useful to show a progress bar using new ā€œPDF Generation Percentageā€ state. But it indicates the PDF generation process itself, without the uploading part

Itā€™s not ran server side but you should be able to include async code in your client side plug-in right?

Right, but isnā€™t context.uploadContent already async? :smiley:

Ok, do you have any tutorial about how to use this ā€œPDF Generation Percentageā€ state ? I would like make a trigger for when the PDF is done execute a workflow.

In the docs please check the ā€œPDF generation. Plugin fieldsā€ section:
https://bubble.digital-bird.com/plugins/export-page-to-pdf#pdf-generation-plugin-fields

Youā€™ll find there ā€œRelated eventsā€ and ā€œRelated statesā€

1 Like

I was thinking you could fire a state after the returned url is awaited.

I also think I completely misread the convo above. Sounded like the user wanted to know a way to identify when the url was available

Hello @BubbleSam !
I try to print the whole page, including header. So I set the ID Attribute of the page and ā€œconvert pdfā€ with this ID. But the header doesnā€™t appears in the pdf. Maybe it is because my header is a floating group ?

Nice. Now Iā€™m able to create a loading with progress bar and after I call to a Popup explain that the download will occur in some seconds. (with a button to return for normal page)

It is working great !

Hello @Sarah_Esteve

Iā€™m created the header with Reusable Elements and it is working. Maybe you need to change itā€¦

Woow! Thatā€™s great!! Really happy that it works now :smiley:

I suppose that your header isnā€™t ā€œinsideā€ of your element (in the HTML code). Have you tried the .main-page or even body selector?

Hello @BubbleSam

Iā€™m tried a lot of thing, but I canā€™t generate the PDF in mobile devices, because it is so slow with my PDF with 30 pages. It loading some time and occur that error on browser that I said.

In desktop, it also slow, it takes more or less 60 seconds to create this PDF with 30 pages. The user need wait in the tab loading.

But if it is bigger? Iā€™m afraid to create a PDF bigger than it. Maybe it will be a big problem for me in the future.

I would like to know if you could study any way to create the PDF on backend workflow?

It will solve my problem, I will can save the link wen the PDF is done and send for my user.

Could you can create a option for we can choose the page to backend workflow open and run the PDF plugin.

Let me know about if you will looking at this feature or if I need looking for another plugin for do that.

Anyway, thank you very much for the plugin, it already met our first need at the moment. I would like to insert it in the long term for other needs that we will have soon.

Hi @B4B ,

You have this issue because your client (a mobile device) uploads the generated PDF file to your server. Since your PDF is relatively big, it takes more than 1 minute, I suppose. The PDF generation process itself should be pretty fast, but the uploading process could be the cause of the described issue.

Since the main idea of this plugin is to capture the rendered HTML into a PDF file, this process must be on the client side (the final HTML is on the client side). So I donā€™t see how we can move the process to the server side unfortunatelyā€¦

The extension you previously posted that works on the server side has a different goal from ours. It uses a predefined template that you can populate with the dynamic data. Thatā€™s why this process could be done on the server side.

I will continue looking for a reliable solution

2 Likes

@BubbleSam Ok, I understood. Maybe create to a feature to simulate the user open HTML in back end? I donā€™t know if is possibleā€¦

@B4B Iā€™ve just released v2.2.0.

Now itā€™s possible to archive the generated PDF file before uploading it to Bubble / downloading on PC.

It helps to highly reduce the generated file size.

I believe that it really could solve your issue!

Could you please test and give us your feedback? :wink:

1 Like

Hello @BubbleSam

I tested here, the loading time is the same. Note that the loading time is about time in generating the PDF, because Iā€™m using the state ā€œPDF Generating Percentageā€ to show it.

I think this problem donā€™t is in uploding file as you said for 2 reasons:

Reason 1 - I tested with single element (using ID of the page ā€œ.main-pageā€) and the speed is very fast (+/-6 seconds).

The speed is slow when I set 30 differents groups.
01

I donā€™t use the global page generating because there is a different bug when generate large PDFs (in my case the page is +/- 25.000 px and 30 pages by groups)

Some elemets with conditionals are dissapears (the bug occur from page 9 onwards as I said in another message)

PS: After that you updated the fit mode and removed the fit height, the ā€œ.main-pageā€ stopped working, all options in fit mode makes a one page PDF with content there and stopped break content to multiple pages.

Reason 2 - I tested with compress 1 and generated the small size PDF (1mb) but the time loading stil the same (+/- 60 seconds) as the compress 80 (5mb)

Could you looking at the process to make PDF with multiple groups?

Maybe you find the issue there!

Hi @B4B ,
Thank you for your feedback.

Yes, archiving canā€™t make the PDF generation process faster but it makes the output file much smaller so it really helps if you need to upload it to Bubbleā€™s storage and generate an URL.

Probably I misunderstood you at the beginning. So for you itā€™s the PDF generation process that takes most of the time, not the file uploading itself?

Could you please give me some details about the following:

  1. How much time does it take to generate a PDF file?
  2. How much time does it take to upload the generated file?
  3. At which step you have the timeout issue?
  4. Ideally, could you please create a small Bubble app which will reproduce all your issues? It will help me a lot! Please send me in PM the id of your Bubble app and I will be able to connect the PDF plugin to this app
1 Like

@BubbleSam oups ā€¦ yes the .main-page works very wellā€¦ thank you

1 Like

Yes @BubbleSam

My problem is in PDF generation process.

1 - How long does it take to generate a PDF file?

I timed from the moment the loading bar go out the 0%. I counted about 65 seconds until go to 100%

2 - How long does it take to load the generated file?

I donā€™t know, because it seems so fast.

3 - At what stage do you have the timeout problem?

I will record a video for you.

4 - The ideal would be to create a small Bubble application that reproduces all your problems?
This will help me a lot! Send me the ID of your Bubble app in PM and I will be able to connect the PDF plug-in to this app

Okay, soon I will do that and send it to you.