memo
indexedDB
学習

IndexedDBを試す


概要

LocalStorageを使っていて、WEB SQLと混同していたがIndexedDBは普通に使っていいっぽいので調べる。


メモ


  • 永続化は許可制

  • キーバリュー

  • JSONが使える

  • Chromeは7GBくらい

  • セキュリティ的にはクッキーに似ているっぽい

  • トランザクションが使える

  • PWAで使うらしい

  • 永続化権限がないと古くなったら消してくれるっぽい

  • IndexedDB 2.0というのがあるっぽい

  • ライブラリ:JsStore dexie localForage


参考

ChromeのIndexedDB(2.0)に、限界までデータを登録してみました - SkyBeje開発記

http://iwatendo.hateblo.jp/entry/2018/02/15/215811

まねきねこプロジェクト|開発ブログ

http://blog.24th.jp/?eid=966921

IndexedDB localstorage セキュリティ - Google 検索

https://www.google.com/search?num=100&ei=WRc7XJbkNer_0gLLpImIBg&q=IndexedDB+localstorage+%E3%82%BB%E3%82%AD%E3%83%A5%E3%83%AA%E3%83%86%E3%82%A3&oq=IndexedDB+localstorage+%E3%82%BB%E3%82%AD%E3%83%A5%E3%83%AA%E3%83%86%E3%82%A3&gs_l=psy-ab.3...14115.16109..16479...0.0..0.193.1779.0j12......0....1..gws-wiz.......0i30j0i8i30j0i8i10i30j0i5i30j0i8i4i30j33i160.KZHQEgdiQRg

IndexedDB を LocalStorage 風に使う

http://var.blog.jp/archives/50624017.html

IndexedDBとWebStorage(localStorageとsessionStorage)のざっくりまとめ - Qiita

https://qiita.com/pensuke81/items/4553cc356a316c7a9235

今時のウェブアプリのローカルストレージ事情 – Jun Mukai's blog

https://wp.jmuk.org/2018/01/23/%E4%BB%8A%E6%99%82%E3%81%AE%E3%82%A6%E3%82%A7%E3%83%96%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E3%83%AD%E3%83%BC%E3%82%AB%E3%83%AB%E3%82%B9%E3%83%88%E3%83%AC%E3%83%BC%E3%82%B8%E4%BA%8B%E6%83%85/

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

https://www.shookuro.com/entry/2018/10/21/114346

Web StorageやindexedDBを扱う上でのセキュリティ上の注意点 - 葉っぱ日記

http://d.hatena.ne.jp/hasegawayosuke/20130308/p1

Webブラウザ上で使えるデータベース、IndexedDBを使ってみよう | hifive開発者ブログ

https://blog.htmlhifive.com/2018/06/06/indexed-db/

Can I use... Support tables for HTML5, CSS3, etc

https://caniuse.com/#search=indexeddb

Progressive Web App のオフライン ストレージ  |  Web  |  Google Developers

https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/offline-for-pwa?hl=ja


lib

https://www.npmtrends.com/db.js-vs-dexie-vs-lawnchair-vs-localforage

IndexedDB | MDN

https://developer.mozilla.org/ja/docs/Web/API/IndexedDB_API


localForage: クライアントサイドのデータストレージ向けに、シンプルな name:value 形式の構文を提供する Polyfill です。バックグラウンドで IndexedDB を使用しますが、IndexedDB をサポートしないブラウザーでは WebSQL や localStorage にフォールバックします。

dexie.js: 優良でシンプルな構文により高速なコード開発を可能にする、IndexedDB のラッパーです。

ZangoDB: IndexedDB の MongoDB ライクなインターフェイスで、MongoDB でおなじみのフィルターリング、射影、ソート、アップデート、集計をサポートしています。

MiniMongo: クライアントサイドのインメモリーの mongodb で localstorage と server sync over http を元にしたもの。MiniMongo は MeteorJS で使われています。

PouchDB: クライアントサイドのブラウザー内の CouchDB 実装で IndexedDB を使っています。


https://www.moongift.jp/2018/09/jsstore-indexeddb%E3%82%92%E4%BD%BF%E3%81%84%E3%82%84%E3%81%99%E3%81%8F%E3%81%99%E3%82%8Bor%E3%83%9E%E3%83%83%E3%83%91%E3%83%BC%E9%A2%A8%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA/

https://www.npmjs.com/search?q=keywords%3Aindexeddb&ranking=popularity

Dexie.jsでIndexedDBを使ってみる - Qiita

https://qiita.com/yamayamasan/items/a4297e724b86f4a00fd2

Dexie.jsとTypeScriptでIndexedDBを操作する - noxi雑記

https://noxi515.hateblo.jp/entry/2018/04/01/233950

lovefield で IndexedDB を SQL風に操作する方法 │ Web備忘録

https://webbibouroku.com/Blog/Article/lovefield-indexeddb

try catch and ...release: Dexie.jsはIndexedDBを超シンプルに扱えるミニマリストのためのライブラリ

https://trycatchand.blogspot.com/2016/09/indexeddb-with-dexiejs.html


dexie.jsよりももっとシンプルなIFを望むなら localForage も良いかも。こちらのIFは localstorage とほとんど同じなので、localstorageを知っている人なら学習コストがほとんどかかりません。