DEV Community 日本語
フォロー
NuxtとOPFSを使ってローカルファーストなPDFツールキットを構築した理由
主流のPDFツールでは、ユーザーは機密文書をリモートサーバーにアップロードする必要があり、転送中の暗号化にもかかわらず、プライバシーと規制上の懸念が生じます。この問題に対処するため、100%クライアントサイドのプログレッシブウェブアプリであるbeePDFは、文書をブラウザ内で完全に処理し、決してアップロードしません。その技術スタックには、Nuxt、@vite-pwa/nuxt、pdf-lib、PDF.js、およびPico CSSが含まれます。主なイノベーションは、ローカル永続化のためにOrigin Private File System(OPFS)を使用していることです。OPFSは、高速なバイトレベルアクセスを備えたプライベートなオリジンスコープのファイルシステムを提供し、PDFのような大きなバイナリファイルに最適です。パーミッションプロンプトを排除し、パフォーマンスのためにWeb Workerで同期アクセスを提供します。処理パイプラインは、ファイルをメモリに読み込み、OPFSに保存し、重いタスクをWeb Workerにオフロードします。メタデータとサムネイルはIndexedDBに保存されます。文書の変更は直接クライアントダウンロードをトリガーし、オフライン機能性を確保します。課題としては、非常に大きなファイルに対するブラウザのメモリ上限と、UIのブロックを防ぐために集中的なタスクをWeb Workerにオフロードする必要性が挙げられます。