Flutter向けPDFビューア、pdfrxのpdfium WASM対応について

Flutter向けPDFビューア、pdfrxでFlutter Web向けのエンジンをPDF.jsからPDFiumのWASM版に置き換える作業を行いました。
WASMは他のプラットフォームのようにFFI経由で簡単に呼び出すことができず、WASM対応のためにはFFIとは異なる仕組みでの実装が必要でした。

通りすがりのDartの中の人たちに見つかり助けてもらった
https://github.com/espresso3389/pdfrx/commit/59dcef1b9f486bf7eafaad0fc41db520e46d0aca#r152367047

ChatGPTさんが作ってくれたたたき台
https://chatgpt.com/c/67a473a3-f638-800e-93f4-f34c25e5cd16

Transcript

1. Flutter向けPDFビューア、 pdfrxのpdfium WASM対応に ついて 川崎 高志 (@espresso3389)
2. 自己紹介 川崎 高志 (@espresso3389) • clairchant合同会社CTO • 最近使っている言語: Flutter, C++, Rust • 仕事も70% Flutter
3. pdfrx pdfrx
4. pdfrx • Flutter向けPDFビューアープラグイン • PDFium(Andoid, iOS, Linux, macOS, Windows) • C++(dart:ffi)のみ！シングルソース！ • Flutter Web対応 • PDF.js → PDFium WASMへの移行を実現
5. Flutter WASM • アプリはオプション付けるだけ？？ • dart2js/dart2wasmの違いに苦しめられる • --wasmオプションで型のチェックが厳格になる • JSの時には出なかったエラーがたくさん出て泣きそうになる • js_interop難しすぎ。わからん。 • 通りすがりのDartの中の人たちに見つかり、総攻撃を食らって、 コードがきれいになった！
6. PDFium WASM • 本体のWASM対応とは別の話 • ネイティブ系 • libpdfium.so+α • ffigenでbindingを自動生成 • dart:ffi経由で呼び出す • WASM(Web) • wasm_ffiは使い物にならない • 力技でもう一つの実装？マジで？
7. PDFium WASM by ChatGPT & Claude • ネイティブFFIのレイヤーを流用はできない • JSでWorkerを使ってFlutter本体とは非同期に処理したい • JSあんまり知らない • WASMあんまり知らない • 僕には無理・・・ • ChatGPTさんがたたき台を作ってくれた • Claudeさんが微調整してくれた • 僕の頑張り
8. Web Worker Main Flutter+PDFium WASM Flutter Engine + App Code WASM/JS JS glue JS glue PDFium WASM
9. Platform Abstraction pdfrxアーキテクチャ PdfViewer (Flutter Widget) PDFDocument/PDFPage pdfrx API (Dart) libpdfium.so C++ libpdfrx. so C++ PdfrxPdfium (Dart) PdfrxWasm (Dart) WASM glue (JS) libpdfium WASM
10. まとめ Vibe Codingはいいぞ！