IndexedDB API を触った

IndexedDB API を初めて使った。

簡単に使えるライブラリはあるが、勉強のために素のままで触った。

https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API

作ったソースコードは下記。

https://github.com/k1350/bookmark/blob/c2435e1ec25bf2b4cf8629c83d1c4e06df03626c/packages/novel-bookmark/src/database.ts

バージョンの更新関連の処理はまだ必要ないので実装していない。

ハマった点

API がコールバック地獄で使いづらい

自分で非同期関数にする。

音もなく失敗する

どこかでアーリーリターンする前に resolvereject を忘れている。

openCursor した結果の event.target.result が null

データベースに何もデータが入ってないと null になるので正常動作である。

openCursor した結果を配列に詰めているつもりだけど、いつも空配列になる

request.onSuccess の中身は cursor(event.target.result)で次のレコードに進むたびに実行され直されるイメージになる。

そのため結果を配列に詰めるのなら、配列の宣言は request.onSuccess の外でやる必要がある。

onSuccess などの引数に型がつかなくてつらい

それな。


触ってみた感触としては、そんなに難しくはなかった。

今まで何となく敬遠していたのだが localStorage よりも使いやすい場面もあるので、今後は選択肢に入れていきたい。
でもパフォーマンスは localStorage のほうがいいらしい。(使い方によると思う。)

おわり