Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
IndexedDBのラッパー「localoForage」を試してみた
Search
Takeshi Nick Osanai
March 20, 2019
Technology
0
2.8k
IndexedDBのラッパー「localoForage」を試してみた
2019年3月20日 PWA Night のLT資料です。
未検証の部分があるため、将来的に資料をアップグレードする可能性があります。
Takeshi Nick Osanai
March 20, 2019
Tweet
Share
More Decks by Takeshi Nick Osanai
See All by Takeshi Nick Osanai
How DevRel should proceed with the breaking change project?
tosanai
0
200
AWS を利用した ウェブサイトホスティングと PowerCMS X
tosanai
1
1.1k
プラットフォーム事業を推進するための開発者マーケティング
tosanai
0
70
MTクラウドハンズオン資料
tosanai
1
120
Movable Type クラウド版 ハンズオンセミナー
tosanai
0
300
20190508_DevRel_Meetup_Public.pdf
tosanai
0
800
Movable Type クラウド版 ハンズオン資料
tosanai
0
120
20190320_MTCloud_handson.pdf
tosanai
0
110
ウェブ技術者の視点から見たPWA
tosanai
0
72
Other Decks in Technology
See All in Technology
Copilot Studio ハンズオン - 生成オーケストレーションモード
tomoyasasakimskk
0
190
serverless team topology
_kensh
2
120
Introduction to Sansan Meishi Maker Development Engineer
sansan33
PRO
0
310
Wasmの気になる最新情報
askua
0
180
初めてのDatabricks Apps開発
taka_aki
1
240
OSSで50の競合と戦うためにやったこと
yamadashy
3
920
React19.2のuseEffectEventを追う
maguroalternative
2
590
Dylib Hijacking on macOS: Dead or Alive?
patrickwardle
0
440
ソースを読むプロセスの例
sat
PRO
15
9.7k
「魔法少女まどか☆マギカ Magia Exedra」の多様なバトルの開発を柔軟かつ効率的に実現するためのPure C#とUnityの分離について
gree_tech
PRO
0
240
「魔法少女まどか☆マギカ Magia Exedra」におけるバックエンドの技術選定
gree_tech
PRO
0
100
クラウドとリアルの融合により、製造業はどう変わるのか?〜クラスメソッドの製造業への取組と共に〜
hamadakoji
0
320
Featured
See All Featured
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
10
880
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
190
55k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
359
30k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Reflections from 52 weeks, 52 projects
jeffersonlam
353
21k
Build your cross-platform service in a week with App Engine
jlugia
232
18k
How to Think Like a Performance Engineer
csswizardry
27
2.1k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
61k
Git: the NoSQL Database
bkeepers
PRO
431
66k
Leading Effective Engineering Teams in the AI Era
addyosmani
7
570
Bash Introduction
62gerente
615
210k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.7k
Transcript
IndexedDBのラッパー 「localForage」を使ってみる 2019年3月20日 シックス・アパート株式会社 ⾧内毅志
自己紹介 • ⾧内毅志(Takeshi Nick Osanai) • ディベロッパーリレーションマネージャー • Movable Type
エバンジェリスト • AWS認定ソリューションアーキテクト • 趣味 ジョギング、野球観戦 英語の勉強 (TOEIC 875, 英検準1級) 家族と過ごすこと @Nick_smallworld
PWAのストレージに関するベストプラクティス https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/offline-for-pwa?hl=ja
IndexedDBとは • ブラウザで利用できるストレージ領域(DB) • Key-Value 形式でデータを保存 • ブラウザのデフォルトストレージになりつつある
localForageとは • WebStorage のような書き方でIndexedDBが使えるラッパー • Mozzila財団のメンバーがメンテナンスをしている
localForageのインストール(Web)
書き方の違い • WebStorage • localForage
localForage と WebStorage ? • WebStorage と localForage で パフォーマンスは異なる?
• 試してみた
パフォーマンス計測 • for文で1000件のデータを作成 • sessionStorage、localForageで回す • 書き込み、読み出しの時間をそれぞれ計測
コード(一部)
•デモ
試した結果 • Chromeでは localForage+IndexedDBの方が全体的に早い • 特に書き込みは数十倍のレベルでWebStorageより高速 • localForage いけるじゃん! •
・・・という結論にしようと思ったのですが
あれ…? • FireFoxではsessionStorageのほうが早い…だと…? • ベンチマークのコードの問題かも • なにかわかったら今度発表します
ありがとうございました! • シックス・アパートの⾧内でした。 • MovableType.net もよろしく お願いします。