DEV Community

Ling Chen
Ling Chen

Posted on

Client-Side PDF Merging: Why "No Upload" File Tools Matter, and How They Work

#javascript #webdev #privacy #pdf

Every developer has been asked by a relative, a colleague or a client: "What's a safe website to merge some PDFs?" The honest answer used to be complicated. Most free online tools upload your files to a server, process them there and send them back. For tax forms, contracts or medical records, that is a real privacy question.

Modern browsers can now do this work locally. This post explains how client-side PDF processing works, what its limits are and what to look for in a tool.

The traditional model: upload, process, download 

[Your file] --upload--> [Server] --process--> [Server storage?] --download--> [You]
Enter fullscreen mode Exit fullscreen mode

The risks are well known:

  • files may be stored or logged longer than you expect
  • the server could be compromised
  • you depend on the vendor's privacy policy, which few people read
  • large files are slow to upload on poor connections

The client-side model 

[Your file] --> [Browser memory] --> [Processed file] --> [Your disk]
Enter fullscreen mode Exit fullscreen mode

Nothing leaves the device. The browser reads the file with the File API, processes it with JavaScript or WebAssembly and offers the result as a download through a Blob URL.

A minimal merge with the open-source pdf-lib library looks like this:

import { PDFDocument } from "pdf-lib";

async function mergePdfs(files) {
  const merged = await PDFDocument.create();
  for (const file of files) {
    const bytes = await file.arrayBuffer();
    const src = await PDFDocument.load(bytes);
    const pages = await merged.copyPages(src, src.getPageIndices());
    pages.forEach((p) => merged.addPage(p));
  }
  const out = await merged.save();
  return new Blob([out], { type: "application/pdf" });
}
Enter fullscreen mode Exit fullscreen mode

Hook that to an <input type="file" multiple> and a download link, and you have a private PDF merger in about 30 lines.

What client-side tools do well

  • Merging and splitting. Copying pages between documents is cheap and fast.
  • Reordering and page layout. Placing two or four pages on one sheet is straightforward geometry.
  • Image compression and conversion. canvas.toBlob() with a quality parameter handles JPEG and WebP, and OffscreenCanvas keeps it off the main thread.
  • Basic table extraction from text-based PDFs.

Where they hit limits

Being honest about limits builds trust:

  • Heavy PDF compression. Big savings usually come from downsampling embedded images. Purely structural compression, such as removing duplicate objects and unused data, often yields modest gains.
  • Scanned documents. Extracting tables from images needs OCR, which is much heavier in the browser.
  • Very large files. Browser memory is finite, so hundreds of megabytes can crash a tab on low-end devices.
  • Exotic PDF features. Some forms, signatures and encryption schemes may not survive processing.

How to tell if a tool really runs locally

You do not have to trust marketing copy. Check it yourself:

  1. Open DevTools, then the Network tab.
  2. Load the tool and clear the log.
  3. Process a file.
  4. Look for any large POST or PUT request carrying your file.

If the only traffic is page assets and analytics, the processing is local. You can even switch to offline mode after the page loads and try again.

A practical example

When people ask me for a recommendation, I point them to FileOtter's PDF merge tool. It merges up to 50 PDFs with drag-to-reorder, and the processing happens in the browser, with no account and no upload. The same site has split, 2-up/4-up layout, PDF-to-Excel for text-based tables and image compression. Its PDF compressor is structural, so it is upfront that savings are usually modest. That is the kind of honesty I like to see.

Building your own? Tips

  • Use Web Workers for anything CPU-heavy to keep the UI responsive.
  • Revoke Blob URLs with URL.revokeObjectURL() after download to free memory.
  • Show clear progress for multi-file operations.
  • State plainly on the page that files are not uploaded, then make sure it is true.
  • Test on a mid-range Android phone, not just your development laptop.

Conclusion

Client-side processing is one of the quiet privacy wins of the modern web. For everyday tasks like merging PDFs or compressing photos, there is little reason to upload sensitive files anywhere. Next time someone asks you for a "safe PDF website", you will have a better answer, and maybe a weekend project.

Top comments (0)