Introduction
In this article, we’ll talk about a series of Javascript libraries for
generating PDFs.
We'll look into real-world use case...
For further actions, you may consider blocking this person and/or reporting abuse
Puppeteer is by far the easiest for me. You just create a page in your frontend framework with html5 /css and use puppeteer with headless chrome to create en exact pdf of that page. Very easy to do you could create a firebase app to use as backend
I just had a question about this approach. Rendering a page on a Headless browser is a resource heavy task.
Were you able to get the desired performance? If yes, how many users was this "firebase app" serving and how many requests for generating a PDF was your backend handling?
Thank You
SNikhill
I was able to get the desired performance but I'm using firebase so performance is never an issue. I don't have many users. Maybe firebase costs will rise fast if you have lot's of users/requests.
Indeed, Puppeteer is one of the easiest ways to create PDFs.
However, it can be difficult to use in some use cases.
If there is a scrollable div container with content, can it the whole scrollable area rather than visible part of div?
@ruben, It may look like easy.
But you have to open a browser, wait for page to load and take the screenshot. It is a CPU intensive work.
You have to manage memory efficiently.
⭐PDFMe⭐ looks promising. Let me try in my upcoming project.
pdfme looks really cool, will definitely try it.
An interesting library is this one too:
react-pdf.org/
It has pretty good ease of use if you are a front-end developer.
What is missing from so many PDF libs is the ability to load and modify existing PDFs. Like, I want to be able to load a PDF and stamp over it "PROCESSED". Well, maybe not that exact example. But at least take exiting PDFs, fill out their forms, add a layer of content, etc...
The signing of PDFs is also another tool. I get that really isn't PDF creation. But still, the e-signing libs can be a chore.
Can I use it in Angular rather than react?
For me the best PDF generator is headless chrome... A litte bit tricky to use but very efficient. the problem is that this chrome functionality has not been maintained for a while... I will try labelmake to see if it well manage page breaks. Thanks.
Good article. Check out the client-side pdf generator github.com/ovvn/dom-to-pdf which makes a printable paginated pdf from DOM.
Cool ! I will need that.
You can also try my own wrapper over puppeteer
github.com/AmirTugi/tea-school
I aimed to make the usage of puppeteer easy.
Any of the above deals with CMYK PDF output? Thanks
Your missing hummus library.
My organization integrated pdf-lib into the stack during a few projects in the last year. We've yet to use it for anything client-side but it's been insanely easy to work with thus far.
Thanks for sharing this informative post.
your article is wonderful and helpful.
do anyone know how to convert the excel to a PDF, should i make a table base on the excel, then convert the table to PDF, any else methods?
Hye, guys. I want to create pdf for my Dashboard items. Which library is good for this purpose?
I have tables and charts in my dashboard, and if I have 2 widgets in my row, I want to see them as they are.
Any suggestions, how can I create same layout in generating pdf?
In pdf translation scenarios, pdfkit works great!
Useful for changing styling in the middle of a paragraph.
Sorry did i miss the section on PDF.js by Mozilla?
PDF.js is not generating PDF.
Could you please share any working example of pdfme with ReactJs?
Please check this!
codesandbox.io/embed/github/pdfme/...
I was trying to work with labelmake on react, but I have some trouble and the documentation is poor.
Thanks for sharing.
anyone know library run in client-side that have: html-to-pdf without using canvas (html2canvas) ? html2canvas is frezzeUI every time it generate canvas
I'm okay with incomplete tutorial, I know some of you are busy guys. But come on PS buttons based evaluation score.
How many of these use headless browser? Puppeteer is resource intensive.
I want output like this.