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
160
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
170
From Strategy Definition to Execution with OKRs and Roadmap
sebarmeli
0
160
From Mission to Strategy: going over OKRs and Roadmap
sebarmeli
0
280
Managing a software engineering team
sebarmeli
1
600
Enforcing coding standards in a JS project
sebarmeli
0
590
Enforcing Coding Standards
sebarmeli
1
120
ES6: The future is now
sebarmeli
2
480
EcmaScript 6 - the future is here
sebarmeli
5
7.3k
Dependency management and Package management in JavaScript
sebarmeli
0
740
Other Decks in Programming
See All in Programming
Cursorハンズオン実践!
eltociear
2
1.2k
Android16 Migration Stories ~Building a Pattern for Android OS upgrades~
reoandroider
0
140
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
620
あなたとKaigi on Rails / Kaigi on Rails + You
shimoju
0
190
CSC509 Lecture 06
javiergs
PRO
0
270
monorepo の Go テストをはやくした〜い!~最小の依存解決への道のり~ / faster-testing-of-monorepos
convto
2
540
3年ぶりにコードを書いた元CTOが Claude Codeと30分でMVPを作った話
maikokojima
0
630
Server Side Kotlin Meetup vol.16: 内部動作を理解して ハイパフォーマンスなサーバサイド Kotlin アプリケーションを書こう
ternbusty
3
240
Go言語の特性を活かした公式MCP SDKの設計
hond0413
2
500
『毎日の移動』を支えるGoバックエンド内製開発
yutautsugi
2
280
テーブル定義書の構造化抽出して、生成AIでDWH分析を試してみた / devio2025tokyo
kasacchiful
0
290
When Dependencies Fail: Building Antifragile Applications in a Fragile World
selcukusta
0
110
Featured
See All Featured
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.5k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
10
890
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
Building Better People: How to give real-time feedback that sticks.
wjessup
369
20k
Keith and Marios Guide to Fast Websites
keithpitt
411
23k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
658
61k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
Site-Speed That Sticks
csswizardry
13
920
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.7k
Making Projects Easy
brettharned
120
6.4k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
9.7k
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