DEV Community

Cover image for How we improved our client-side PDF generation by 5x

How we improved our client-side PDF generation by 5x

Karan Janthe on March 17, 2024

At Smartagent, we faced a challenge that might sound familiar to many developers: our client-side PDF generation feature was struggling under the w...
Collapse
 
auroratide profile image
Timothy Foster

One of my clients wanted PDF generation and we realized: literally just window.print() does this. Saved us probably months of development time and architectural heartache.

Collapse
 
xiaowo profile image
xiaowo

yes but sometime we need assembled data

Collapse
 
mordechaim profile image
Mordechai Meisels

@media print

Collapse
 
soanvig profile image
Mateusz Koteja • Edited

Wtf. Why you are generating PDFs on the frontend, not backend? Especially for 22k rows. I understand you send those rows to the client? My god.

"this approach would require us to rewrite our entire PDF generation logic a daunting task "

Yes, because you made a mistake in the beginning. Honestly you should get it straight ASAP. Those PDFs were generating for at least 30 seconds, and im sure you had a lot of time previously to tackle that problem.

The solution is cool though, anyway

Collapse
 
j0nimost profile image
John Nyingi

client side loading 22k rows, chances are high of rendering a users machine unusable while it's processing the PDF, isn't that going to affect user experiences?

Collapse
 
karanjanthe profile image
Karan Janthe

tanstack table handles this in very good way, it has virtualization and other UI related optimization and obviously, we use pagination!

Collapse
 
krishna404 profile image
krishna404

I believe @j0nimost is talking about pdf-creation & rendering.

Collapse
 
krishna404 profile image
krishna404

In a web-worker, it takes longer than the main thread but we didnt face that issue. Phones did heat up though...

Collapse
 
j0nimost profile image
John Nyingi

lol 😂, i can imagine it on older laptops 4th gen intel laptops with 4GB ram, or tablets.

Collapse
 
kvetoslavnovak profile image
kvetoslavnovak • Edited

From my own experience I can confirm that frontend client side web worker solution is the way to go.

Collapse
 
krishna404 profile image
krishna404

You talked about 22k rows. How much time did 22k rows take?

Collapse
 
shradhhu_53 profile image
Shraddha Khattar

It must have taken longer time.

Collapse
 
krishna404 profile image
krishna404

I thought 22 is a smaller number :|

Collapse
 
shifi profile image
Shifa Ur Rehman

Well ofcourse watson.

Collapse
 
timothyokooboh profile image
timothyokooboh

Thanks for sharing!

Collapse
 
monjai profile image
mon-jai • Edited

What wasm pdf library did you use?