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
Web Storage
Search
Sebastiano Armeli
March 09, 2011
Programming
0
150
Web Storage
Talk given in March 2011
Sebastiano Armeli
March 09, 2011
Tweet
Share
More Decks by Sebastiano Armeli
See All by Sebastiano Armeli
Cultivate Excellence In Engineering Teams through Continuous Software Engineering
sebarmeli
1
150
From Strategy Definition to Execution with OKRs and Roadmap
sebarmeli
0
150
From Mission to Strategy: going over OKRs and Roadmap
sebarmeli
0
270
Managing a software engineering team
sebarmeli
1
590
Enforcing coding standards in a JS project
sebarmeli
0
580
Enforcing Coding Standards
sebarmeli
1
120
ES6: The future is now
sebarmeli
2
480
EcmaScript 6 - the future is here
sebarmeli
5
7.2k
Dependency management and Package management in JavaScript
sebarmeli
0
730
Other Decks in Programming
See All in Programming
AI駆動のマルチエージェントによる業務フロー自動化の設計と実践
h_okkah
0
170
“いい感じ“な定量評価を求めて - Four Keysとアウトカムの間の探求 -
nealle
2
11k
すべてのコンテキストを、 ユーザー価値に変える
applism118
3
1.4k
たった 1 枚の PHP ファイルで実装する MCP サーバ / MCP Server with Vanilla PHP
okashoi
1
270
Python型ヒント完全ガイド 初心者でも分かる、現代的で実践的な使い方
mickey_kubo
1
140
PostgreSQLのRow Level SecurityをPHPのORMで扱う Eloquent vs Doctrine #phpcon #track2
77web
2
540
ペアプロ × 生成AI 現場での実践と課題について / generative-ai-in-pair-programming
codmoninc
2
19k
20250628_非エンジニアがバイブコーディングしてみた
ponponmikankan
0
700
git worktree × Claude Code × MCP ~生成AI時代の並列開発フロー~
hisuzuya
1
590
型で語るカタ
irof
0
200
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
koboriakira
0
600
Rails Frontend Evolution: It Was a Setup All Along
skryukov
0
160
Featured
See All Featured
Being A Developer After 40
akosma
90
590k
How to Ace a Technical Interview
jacobian
278
23k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
Code Reviewing Like a Champion
maltzj
524
40k
How to Think Like a Performance Engineer
csswizardry
25
1.7k
Making the Leap to Tech Lead
cromwellryan
134
9.4k
Rails Girls Zürich Keynote
gr2m
95
14k
The World Runs on Bad Software
bkeepers
PRO
69
11k
Documentation Writing (for coders)
carmenintech
72
4.9k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
20k
Fireside Chat
paigeccino
37
3.5k
Transcript
Web Storage Sebastiano Armeli-Battana
[email protected]
@sebarmeli Sunday, 20 February 2011
Remote Data Storage Sunday, 20 February 2011
Why Web Storage? • Performance • Speed • Reduced load
on the servers • Offline applications • Transaction - HTTP stateless Sunday, 20 February 2011
History of Client-side Storage •HTTP Cookie • userData Behaviour in
IE 5.5 • Local Shared Objects in Adobe Flash • Google Gears Sunday, 20 February 2011
Web Storage • by WHATWG / W3C • HTML5? Actually
not... • 2 Storage Areas : • localStorage • sessionStorage • globalStorage HTML Sunday, 20 February 2011
Storage API interface Storage { readonly attribute unsigned long length;
DOMString key(in unsigned long index); getter any getItem(in DOMString key); setter creator void setItem(in DOMString key, in any value); deleter void removeItem(in DOMString key); void clear(); }; Sunday, 20 February 2011
localStorage • localStorage.setItem(“key1”, “value1”); localStorage.setItem(“key2”, “value2”); • localStorage.getItem(“key1”); // “value1”
• localStorage.length; //2 • localStorage.removeItem(“key1”); • localStorage.length; // 1 • localStorage.clear(); • localStorage.length; // 0 Sunday, 20 February 2011
sessionStorage • sessionStorage.setItem(“key1”, “value1”); sessionStorage.setItem(“key2”, “value2”); • sessionStorage.getItem(“key1”); // “value1”
• sessionStorage.length; //2 • sessionStorage.removeItem(“key1”); • sessionStorage.length; // 1 • sessionStorage.clear(); • localStorage.length; // 0 Sunday, 20 February 2011
Storing Objects • Key/value pairs • Value is a STRING!
• Stringify / Parse JS Objects • JSON.stringify(myObject); • JSON.parse(myString); Sunday, 20 February 2011
Storage Event • “storage” event • Triggered when Storage Areas
change • Binded on Window • Attributes: • key, • oldValue • newValue • url Sunday, 20 February 2011
Support • IE 8+ • FF 3.5+ • Safari 4+
• Chrome 7+ • Opera 10.6+ • iOS Safari 4.0+ / Android 2.2+ Sunday, 20 February 2011
JS Utilities • YUI2 Storage • Dojo Storage • PersistJS
Sunday, 20 February 2011
Advantages (over Cookies) • Saving Bandwith • Size • Sessions
not leaking • Network sniffing Sunday, 20 February 2011
Limitations • 5 Mb (or 10Mb) • “QUOTA_EXCEEDED_ERR” • “SECURITY_ERR”
• Storage per origin • Cross directory attacks -> DO not USE it! • DNS Spoofing -> SSL Sunday, 20 February 2011
The future of Web Storage • Store data that rarely
change • Mobile Sites • Offline apps • More Storage? Index Database API Sunday, 20 February 2011
Thank you. Sunday, 20 February 2011