DEV Community

productcool
productcool

Posted on Originally published at pdftip.hashnode.dev

How We Built a 100% Client-Side PDF to Markdown Converter in WebAssembly

#productivity

Converting complex PDF documents into structured, clean Markdown is one of the most frequent workflows for developers, researchers, and technical writers today—especially when feeding documentation into LLMs and RAG pipelines.

However, almost every existing online PDF converter requires you to upload sensitive files to remote servers. This introduces three major drawbacks:

  1. Privacy & Security Risks: Confidential contracts, financial statements, and proprietary documentation leave your local environment.
  2. Bandwidth & Latency: Large multi-megabyte PDFs must be uploaded and re-downloaded, causing slow processing times.
  3. Paywalls & Cloud Costs: Running heavy OCR or serverless Python microservices costs money, forcing tool providers to impose file size limits, daily caps, or expensive subscriptions.

To solve this, we architected PDFtip—a completely free, 100% client-side PDF utility suite powered by WebAssembly (WASM). In this article, we share how we built our PDF to Markdown converter entirely in the browser.

The Architecture: Why WebAssembly?

Modern browsers have evolved into mini operating systems capable of executing near-native code at blistering speeds. By compiling PDF parsing engines into WebAssembly, we can process files right inside the user's browser thread or background Web Worker.

Key Architectural Highlights:

  • Zero Server Uploads: Files never touch an external server or database. All processing takes place in local RAM.
  • Instant Processing: Without network roundtrips for multi-megabyte payloads, conversion starts instantly upon file drop.
  • Unlimited & Zero Cost: Because computation is distributed to the client machine, there are zero backend compute costs, allowing us to offer the service 100% free with no file limits.

Handling Text Extraction & Formatting

PDF is inherently a presentation format, not a semantic document structure. It defines coordinate positions of glyphs rather than paragraphs, headings, or tables.

To bridge this gap into clean Markdown:

  1. Coordinate Geometry Clustering: We extract bounding boxes of text elements and calculate line heights to deduce heading levels (#, ##, ###).
  2. List & Table Reconstruction: Sequential bullet markers and columnar x-coordinates are detected and formatted into GFM (GitHub Flavored Markdown) syntax and markdown tables.
  3. Code Block Detection: Monospace fonts (e.g., Courier, Consolas, Fira Code) are identified to wrap snippets into fenced code blocks.

Offloading to Web Workers for 60fps UI

Running heavy document parsing on the main thread will cause the browser UI to stutter or freeze. To guarantee a silky smooth user experience:

  1. When a user selects a PDF on PDFtip, the File object is read via FileReader or streamed directly as an ArrayBuffer.
  2. The buffer is transferred (postMessage with Transferable Objects) to a dedicated Web Worker.
  3. The WASM runtime extracts text nodes, computes layout heuristics, and streams converted Markdown chunks back to the UI.

This ensures zero frame drops, even when parsing 100+ page documents.

Try It Out

If you are looking for a fast, private way to convert your PDF files into Markdown without uploading your data to third-party clouds, check out:

We are constantly expanding the toolset with client-side PDF merging, compression, splitting, and OCR. We'd love to hear your feedback and technical thoughts!

Top comments (0)