IndexedDB に入門してみる - 山崎屋の技術メモ

Web アプリ界隈で WebStorage に変わる機能として徐々に認知されつつある IndexedDB があります。

スマホブラウザからネイティブアプリのように Web アプリを機能させる PWA を作るにあたって、この IndexedDB についても精通しておく必要があるので勉強してみました。

まずはこのあたりを読んでみましょう。

MDN。読みづらいページが多いイメージですが、IndexedDB については理解しやすく翻訳されていました。
IndexedDB | MDN

Qiita。実際の使い方が参考になります。
IndexedDBの使い方 - Qiita

簡単にいうとブラウザの一機能で Cookie の兄貴分ですね。ポイントを自分なりにまとめてみました。

Cookie より大きいサイズのデータを保持できる。（実際の上限はブラウザ依存。Cookie の上限は 4096 バイト未満。）
ひとつの DB は同一ドメインからしかアクセスできない。（Cookie と同じ）
JavaScript のオブジェクト型のデータを格納する。
RDB のテーブルに相当するものを Store や Object Store という。
Store 作成時に列定義は不要だが、キー項目を指定する必要がある。
トランザクションが使えるので RDB のように原子性が保たれる。
クッキー消去くらいの気軽さでユーザがデータを消せるので、大事なデータは保持しないほうがいい
IndexedDB のデータファイル保存場所

　　【chrome】
　　　C:\Users\<ユーザ>\AppData\Local\Google\Chrome\User Data\Default\IndexedDB

　　【firefox】
　　　C:\Users\<ユーザ>\AppData\Roaming\Mozilla\Firefox\Profiles\XXXXX.default\storage\default

以上、簡単ではありますが IndexedDB の特徴をまとめてみました。

実際の Web アプリケーションでの使用例も別途記事にしていきたいと思います。