Highly Efficient PDF Renderer

Hi Folks,

I’ve been working on HEPR (Highly Efficient PDF Renderer), a GPU-first PDF renderer aimed at very large, vector-heavy floorplan PDFs, but it can also handle PDF books with hundreds, or >1000 of pages with ease.

The motivation came from floorplans exported from Revit and similar BIM/CAD tools. These files can be technically valid PDFs, but they often contain huge amounts of vector geometry. In regular PDF viewers, opening them can take a long time, and panning or zooming can become very slow or even crash the viewer.

Most web-based approaches rasterize these PDFs into tiles. That works, but it has tradeoffs: tile generation can be expensive, real-time client-side rasterization can be painful for huge files, and deep zoom eventually becomes blurry unless you generate many zoom levels.

HEPR takes a different approach: it extracts PDF vector data and renders it through WebGL/WebGPU/three.js-friendly GPU paths, so large floorplans can stay sharp while zooming.

It includes:

  • WebGL and WebGPU backends
  • A three.js THREE.Group wrapper
  • Vector strokes, fills, text, and embedded raster image layers
  • Parsed ZIP export/import to skip repeated PDF extraction (much faster to load)
  • Nanite-inspired Vector LOD for reducing rendered stroke segment counts based on the camera/view
  • GPU text rendering ideas inspired by the work shared at https://wdobbie.com/. Thanks to @wjdobbie for publishing those articles and demos.

Demos:

npm:

Github repo:

It is still early, and I would especially appreciate feedback from people who have dealt with large architectural PDFs or PDF rendering inside three.js scenes.

5 Likes

A while ago I was trying to find something like this - that would let show PDF files in threejs. The only thing I found was using pdf.js to render to a canvas and use that as a texture. I was surprised there was not much discussion about other options. (Did I miss something?)

This is very helpful. Essentially, I’m trying to build websites with as little html/css as possible. Finding ways to present pdf files in 3D space, that scale up with the level of detail, etc. is a big benefit.

Wow!

1 Like

So glad you found it useful! Feel free to share your project that uses my lib, I’m interested! Also if you find any bugs/problems, or if you want new features, let me know!

I am building an ERP system that will require a lot of PDF file uploads with three.js objects placed overtop, and I am going to give this a go, as like you said, the rasterized tiles are killing performance. thanks for making this available