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
73
Web Storage
Talk given in March 2011
Sebastiano Armeli
March 09, 2011
Tweet
Share
More Decks by Sebastiano Armeli
See All by Sebastiano Armeli
From Strategy Definition to Execution with OKRs and Roadmap
sebarmeli
0
70
From Mission to Strategy: going over OKRs and Roadmap
sebarmeli
0
220
Managing a software engineering team
sebarmeli
1
490
Enforcing coding standards in a JS project
sebarmeli
0
530
Enforcing Coding Standards
sebarmeli
1
100
ES6: The future is now
sebarmeli
2
460
EcmaScript 6 - the future is here
sebarmeli
5
6.9k
Dependency management and Package management in JavaScript
sebarmeli
0
620
Karma - JS Test Runner
sebarmeli
1
750
Other Decks in Programming
See All in Programming
Deno に Web 標準 API を実装する / Implementing Web Standard API to Deno
petamoriken
0
350
LPIXEL×CADDi_kaerururu
kaerururu
3
300
Cloud RunとCloud PubSubでサーバレスなデータ基盤2024 with Terraform / Cloud Run and PubSub with Terraform
shinyorke
7
1.9k
実践!RDRAを活用した既存システムの仕様変更 / Specification Changes in Existing Systems Utilizing RDRA
imamotohikaru
0
2.1k
WebComponentsで フレームワークを1ページに共存させる
webuilder240
0
150
Learning PHP and Static Analysis with PHP Parser
inouehi
1
250
SwiftUI, Jetpack Composeの導入で変化した「家族アルバム みてね」のアプリ開発体験
hicka04
6
390
導入から5年が経って見えた Datadog APM 運用の課題
bgpat
2
540
TCA魔法学入門🪄
dazy
0
280
Data Contracts In Practice With Debezium and Apache Flink (Kafka Summit London)
gunnarmorling
2
270
PHPでOfficeファイルを取り扱う! PHP Officeライブラリを プロダクトに組み込んだ話
hirobe1999
0
840
TDDと今まで
kanayannet
0
140
Featured
See All Featured
A better future with KSS
kneath
230
16k
The Art of Programming - Codeland 2020
erikaheidi
40
12k
4 Signs Your Business is Dying
shpigford
174
21k
Designing the Hi-DPI Web
ddemaree
275
33k
The World Runs on Bad Software
bkeepers
PRO
60
6.6k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
355
22k
Into the Great Unknown - MozCon
thekraken
10
830
Embracing the Ebb and Flow
colly
78
4.1k
Why You Should Never Use an ORM
jnunemaker
PRO
50
8.6k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
8
8.2k
How To Stay Up To Date on Web Technology
chriscoyier
781
250k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
1
1.2k
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