Technical

Cara Kerja Edit PDF Berbasis Browser (dan Mengapa Privasi Penting)

Cara LuraPDF memproses PDF sepenuhnya di browser Anda dengan pdf-lib, pdfjs-dist, Tesseract.js, dan WebAssembly, sehingga file tidak pernah diunggah.

LuraPDF Team
LuraPDF Team

Tim Editorial & Teknis · 6 Mei 2026 · 8 menit baca

Setiap kali Anda mengunggah dokumen ke alat PDF berbasis cloud, dokumen tersebut berada di server yang tidak Anda kendalikan, diproses oleh perangkat lunak yang tidak dapat Anda periksa, disimpan oleh perusahaan dengan kebijakan retensi data dan postur keamanannya sendiri. Untuk sementara waktu, infrastruktur milik orang lain menyimpan kontrak, laporan pajak, rekam medis, atau dokumen bisnis rahasia Anda.

LuraPDF bekerja secara berbeda. Semua proses terjadi di tab browser Anda, pada perangkat keras Anda, dengan manajemen memori sistem operasi Anda sendiri. Artikel ini menjelaskan arsitektur teknis yang memungkinkan hal ini dan pertukaran rekayasa yang terlibat.

Browser sebagai Platform Pemrosesan Dokumen

Browser modern bukan lagi sekadar perenderan HTML. Browser adalah lingkungan eksekusi aplikasi penuh dengan:

  • Mesin JavaScript (V8 di Chrome, SpiderMonkey di Firefox): mengeksekusi kode mendekati kecepatan native
  • WebAssembly (WASM): mengeksekusi kode C/C++ yang dikompilasi mendekati kecepatan native dalam lingkungan sandbox
  • Canvas API: memungkinkan manipulasi gambar pada tingkat piksel
  • File System Access API: memungkinkan pembacaan file lokal tanpa mengunggah
  • Web Workers: menjalankan komputasi di thread latar belakang tanpa membekukan antarmuka pengguna
  • ArrayBuffer / Blob: mengelola data biner mentah (seperti byte PDF) dalam memori

Kemampuan-kemampuan ini bersama-sama memungkinkan pipeline pemrosesan dokumen berfitur lengkap yang lima tahun lalu masih membutuhkan server backend.

Tiga Pustaka Inti

LuraPDF dibangun di atas tiga pustaka open-source fondasional:

pdf-lib

pdf-lib adalah pustaka TypeScript untuk membuat dan memodifikasi dokumen PDF di lingkungan JavaScript mana pun. Pustaka ini mengimplementasikan bagian substansial dari spesifikasi PDF (ISO 32000), termasuk:

  • Pembuatan, modifikasi, dan penghapusan halaman
  • Penyisipan font (baik 14 font standar maupun font TTF/OTF kustom)
  • Penyisipan gambar (JPEG, PNG)
  • Penempatan anotasi teks
  • Pembuatan dan manipulasi kolom formulir
  • Metadata dokumen (judul, penulis, tanggal pembuatan, dll.)
  • Perlindungan kata sandi dokumen
  • Manajemen tabel cross-reference

Ketika LuraPDF menggabungkan PDF, ia menggunakan pdf-lib untuk membaca pohon halaman setiap dokumen, menormalisasi resource bersama, dan merakit PDF baru. Ketika mengompresi, ia mengulang pengkodean objek gambar dengan faktor kualitas yang lebih rendah. Ketika melindungi file dengan kata sandi, ia menurunkan kunci dari kata sandi Anda dan menulis dokumen terenkripsi menggunakan PDF Standard Security Handler yang dipahami oleh setiap pembaca PDF.

pdf-lib beroperasi sepenuhnya pada objek ArrayBuffer — data biner mentah dalam memori browser. Tidak ada panggilan jaringan yang dilakukan.

pdfjs-dist

PDF.js adalah mesin perenderan PDF milik Mozilla, didistribusikan sebagai pdfjs-dist di npm. Ini adalah mesin yang menggerakkan penampil PDF bawaan Firefox, diuji terhadap jutaan PDF dunia nyata.

LuraPDF menggunakan pdfjs-dist untuk:

  • Perenderan halaman: Mengonversi halaman PDF menjadi Canvas ImageData untuk ditampilkan
  • Ekstraksi teks: Membaca aliran konten teks dari halaman PDF
  • Metadata halaman: Mendapatkan dimensi halaman, nilai rotasi, dan jenis konten

Ketika Anda melihat PDF Anda dirender di antarmuka LuraPDF — pratinjau visual halaman — itulah pdfjs-dist yang merender setiap halaman ke elemen HTML Canvas.

Tesseract.js

Tesseract.js adalah versi yang dikompilasi dengan WebAssembly dari Tesseract OCR. Tesseract adalah mesin OCR open-source yang awalnya dikembangkan oleh HP Labs (1985) dan saat ini dikelola oleh Google. Mesin ini menggunakan model jaringan saraf LSTM (Long Short-Term Memory) untuk pengenalan karakter.

Menjalankan Tesseract melalui WebAssembly di browser berarti:

  • Biner WASM sebesar 22 MB dimuat sekali dan di-cache oleh browser
  • Pemrosesan OCR berjalan pada CPU melalui WebAssembly, bukan GPU
  • Pemrosesan lebih lambat dibanding OCR cloud (yang menggunakan kluster GPU) tetapi menghasilkan kualitas output yang sama
  • Konten dokumen Anda tidak pernah meninggalkan perangkat Anda

Untuk scan 20 halaman: OCR browser membutuhkan sekitar 30–120 detik. Layanan cloud mungkin membutuhkan 2–5 detik. Pertukaran yang terjadi adalah privasi vs. kecepatan.

Arsitektur: Dari File ke Output

Berikut yang terjadi ketika Anda, misalnya, mengompresi PDF di LuraPDF:

  1. Pemilihan file: Anda menyeret PDF ke dropzone. File API browser membaca file ke dalam ArrayBuffer — byte mentah dalam memori browser. Tidak ada unggahan yang terjadi.

  2. Validasi: Pemeriksaan cepat bahwa byte ajaib %PDF muncul di awal ArrayBuffer.

  3. Pemuatan: PDFDocument.load() milik pdf-lib mengurai tabel cross-reference, membaca pohon objek, dan membangun representasi dokumen dalam memori.

  4. Enumerasi gambar: Pustaka menelusuri aliran konten halaman untuk menemukan XObject gambar (gambar yang disematkan). Lebar, tinggi, jenis kompresi, dan data byte setiap gambar diekstrak.

  5. Pengulangan pengkodean: Untuk setiap gambar, data piksel mentah digambar ke elemen HTML Canvas, kemudian diekspor ulang dengan faktor kualitas JPEG yang lebih rendah menggunakan canvas.toBlob('image/jpeg', quality). Objek gambar asli diganti dengan versi yang lebih kecil yang telah dikodekan.

  6. Serialisasi dokumen: Metode save() milik pdf-lib melakukan serialisasi dokumen yang telah dimodifikasi kembali menjadi byte. Aliran objek dikompresi dengan DEFLATE.

  7. Unduh: Byte dibungkus dalam objek Blob, URL objek sementara dibuat (URL.createObjectURL(blob)), dan klik <a> secara programatik memicu mekanisme unduhan browser.

Total data yang dikirimkan ke server eksternal mana pun: nol byte.

Web Workers: Menjaga Antarmuka Tetap Responsif

Pemrosesan PDF membutuhkan CPU yang intensif. Menjalankannya di thread JavaScript utama akan membekukan tab browser — Anda tidak bisa menggulir, mengklik, atau melihat pembaruan progres selama file sedang diproses.

LuraPDF menjalankan semua komputasi berat (OCR, penguraian PDF besar, pengulangan pengkodean gambar) di Web Workers — thread JavaScript terpisah yang berjalan di latar belakang. Thread utama menangani antarmuka pengguna, menampilkan bilah progres, dan berkomunikasi dengan worker melalui pengiriman pesan (postMessage / onmessage).

Ketika OCR berjalan, event progres dipicu setelah setiap halaman diproses. Worker mengirim { page: 5, total: 20, confidence: 94 } ke thread utama, yang memperbarui bilah progres. Antarmuka pengguna Anda tetap interaktif sepanjang waktu.

Manajemen Memori

Memori browser bersifat terbatas. PDF sebesar 200 MB yang dimuat ke dalam memori, diproses, dan disimpan dapat membutuhkan 400–600 MB RAM (byte asli + data Canvas perantara + byte output). Pada sistem dengan RAM terbatas, ini dapat memicu tekanan memori.

Strategi yang digunakan:

  • Pemrosesan halaman streaming: Untuk operasi multi-halaman, halaman diproses dan elemen Canvas perantara dibuang setelah digunakan
  • URL.revokeObjectURL(): URL blob sementara dicabut setelah diunduh untuk memungkinkan GC
  • Penghentian Worker: Web Workers dihentikan setelah menyelesaikan tugasnya untuk mengambil kembali memori yang digunakan

Untuk file yang sangat besar (>100 MB), browser modern menangani ini tanpa masalah pada sistem dengan RAM 8+ GB. Sistem yang lebih lama atau terbatas memori mungkin kesulitan dengan file sumber 100+ MB.

Arsitektur Privasi

Model keamanan diterapkan oleh kebijakan same-origin dan arsitektur isolasi browser:

  • Tanpa permintaan HTTP: Tidak ada panggilan API eksternal, tidak ada telemetri, tidak ada panggilan analitik selama pemrosesan dokumen
  • Eksekusi sandbox: Web Workers tidak dapat melakukan panggilan jaringan ke origin eksternal
  • Tanpa penyimpanan persisten: File yang diproses tidak ditulis ke penyimpanan browser (localStorage, IndexedDB, atau File System Access)
  • Memori cakupan tab: Ketika Anda menutup tab, semua ArrayBuffer dan objek Blob yang terkait dengannya dikumpulkan oleh garbage collector

Arsitektur ini dapat diverifikasi: buka tab Jaringan di DevTools browser saat memproses file. Anda akan melihat nol permintaan selama operasi pemrosesan.

Pustaka Open Source: Dapat Diperiksa, Bukan Kotak Hitam

Ketiga pustaka inti — pdf-lib, pdfjs-dist, dan Tesseract.js — adalah open source dengan repositori publik di GitHub. Implementasinya dapat diperiksa oleh siapa saja. Kode pemrosesan PDF yang berjalan di LuraPDF bukan kotak hitam proprietary; ini adalah kode publik dengan pengguna, isu, dan kontribusi nyata.

Hal ini penting untuk kepercayaan. Ketika layanan cloud mengatakan "kami memproses dan menghapus file Anda," Anda mempercayai kata-kata mereka. Ketika LuraPDF menggunakan pustaka open-source dalam sandbox browser tanpa panggilan jaringan, Anda dapat memverifikasi klaim tersebut dengan mengamati tab jaringan.

Pertukaran vs. Pemrosesan Cloud

Model berbasis browser memiliki pertukaran nyata yang layak untuk disampaikan secara jujur:

Kecepatan: Layanan cloud memiliki kluster GPU dan infrastruktur khusus. OCR browser pada dokumen besar membutuhkan waktu 2–10x lebih lama dibanding setara cloud. Kompresi cepat karena menggunakan Canvas API secara langsung.

Batas ukuran file: Memori browser adalah batasannya. File yang sangat besar (>300 MB) mungkin mencapai batas memori pada beberapa sistem. Layanan cloud tidak memiliki batasan seperti itu.

Daya pemrosesan: WASM berjalan pada 40–80% kecepatan C++ native. Layanan cloud menjalankan kode native yang dioptimalkan. Untuk sebagian besar dokumen perbedaan ini tidak terasa; untuk pekerjaan OCR 100+ halaman ini cukup terlihat.

Fitur: Beberapa fitur PDF tingkat lanjut (pemeriksaan kepatuhan PDF/X, manajemen warna profesional, alur kerja CMYK) memerlukan alat sisi server yang terspesialisasi. Pemrosesan berbasis browser menangani 95% kasus.

Untuk pemrosesan dokumen sehari-hari — mengompresi, menggabungkan, menandatangani, mengonversi, meredaksi — model berbasis browser cukup cepat, bersifat privat secara desain, dan tidak memerlukan akun atau langganan.

Pertanyaan yang Sering Diajukan

Apakah LuraPDF mengumpulkan telemetri atau data penggunaan? LuraPDF menggunakan Google Analytics untuk statistik tampilan halaman agregat. Operasi pemrosesan dokumen tidak menghasilkan event analitik. Konten file Anda tidak pernah dikirimkan.

Bisakah saya memverifikasi bahwa tidak ada unggahan yang terjadi? Ya. Buka Developer Tools (F12), klik tab Jaringan, filter berdasarkan "XHR" atau "Fetch." Proses sebuah file. Amati nol permintaan jaringan terkait dokumen selama pemrosesan.

Mengapa OCR membutuhkan waktu begitu lama dibanding layanan lain? Tesseract.js berbasis browser berjalan pada CPU melalui WebAssembly. Layanan OCR cloud berjalan pada kluster GPU yang memproses karakter jauh lebih cepat. Pertukaran yang terjadi adalah dokumen Anda tidak pernah meninggalkan browser Anda.

Apa yang terjadi jika saya menutup tab saat pemrosesan berlangsung? Pemrosesan langsung berhenti. Memori tab browser dikumpulkan oleh garbage collector. File asli Anda di disk tidak berubah.

Apakah kodenya open source? Pustaka pemrosesan inti (pdf-lib, pdfjs-dist, Tesseract.js) adalah open source. Kode antarmuka LuraPDF saat ini tidak open source, tetapi pipeline pemrosesan hanya menggunakan komponen open-source.

Peralihan ke pemrosesan dokumen berbasis browser bukan sekadar gimmick. Ini adalah pilihan arsitektur yang tulus dengan keunggulan privasi dan kepercayaan yang terukur — dengan biaya kecepatan pada operasi intensif. Untuk dokumen yang Anda lebih suka tidak ada di server orang lain, ini adalah pertukaran yang tepat.

Tentang penulis

LuraPDF Team
LuraPDF Team

Tim Editorial & Teknis · 6 Mei 2026 · 8 menit baca

Tim LuraPDF terdiri dari para ahli pemrosesan dokumen, insinyur software, dan penulis teknis yang menjadikan pengeditan PDF gratis, privat, dan mudah diakses oleh semua orang.