TYPES 1 2 3 Social networks, news, article applications. Fetch updates to read them offline. Use cases: transport, out of network coverage CONTENT DRIVEN Applications that are designed with battery life and performance in mind. Reduced network usage MOBILE Applications designed to keep your content safe without relaying on network connection CONTENT CRAFTING 1 2 3 &GVGEVHGCVWTGU PQVDTQYUGTU
2 3 Images, Fonts, Pages, JS/CSS source files STATIC ASSETS Once cached no network requests will be done until cache is valid ZERO NETWORK REQUESTS Application cache is valid only if all declared resources are available. In other case everything will be fetched from server again NO PARTIAL CACHING 1 2 3 APPLICATION CACHE &GENCTCVKQPU 0Q#2+VQWUG
2 3 Can handle only strings as keys or values. Objects must be serialized before saving TEXTUAL DATA Easy to use key/value storage. Fast access in case you know exact match for your record KEY VALUE Relatively small amount of data: articles, documents, Base64 encoded images WHEN 5Mb IS ENOUGH 1 2 3 9JGPPQVJKPIGNUG KUCXCKNCDNG WEB STORAGE
name or key of the item that was set or removed. newValue Holds the new value of the item, or null if removeItem() was called. oldValue Holds the old value of an existing item that changed or was deleted, or null if a new item was inserted. storageArea This property will equal either the localStorage or the sessionStorage property of the target Window object. url The URL (as a string) of the document whose script made this storage change. 'XGPVPCOG UVQTCIG
2 3 Based on SQLite you are able to use traditional SQL queries. SQL Ability to apply multiple queries and rollback in case of error TRANSATIONS ~50Mb of storage space available, with possibility to ask for more — platform dependent WHEN 5Mb IS *NOT* ENOUGH 1 2 3 WEBSQL
Does not use SQL, stores key:value pairs NO SQL Ability to apply multiple queries and rollback in case of error TRANSATIONS Possibility to ask for more — platform dependent WHEN 5Mb IS *NOT* ENOUGH 1 2 3 INDEXED DB
{unique: true}); store.createIndex(“by_name”, "name", store.createIndex(“by_email”, "email", {unique:true}); var index = store.index(“by_title”); var request = index.get(name); request.onsuccess = function(e) { var result = e.target.result; … };
drivers from supported and use them FEATURE DETECTION Use the same, unified APIs for all storages COMMON INTERFACE APIs are generally much simpler then using Core APIs of storages EASIER TO USE 1 2 3 LIBRARIES
ialpert
nkforwork
kakao
suzukihoge
fadis
mikik0
manfredsteyer
righttouch
ysk8hori
mot_techtalk
murabayashi
tsoshiro
izumin5210
moore
tammyeverts
jcasabona
iamctodd
scottboms
swwweet
morganepeng
shlominoach
tanoku
honnibal
maltzj
philnash
![EPAM Systems 2 ! " # [email protected] HTTP://UA.LINKEDIN.COM/IN/IALPERT IGOR ALPERT](https://files.speakerdeck.com/presentations/cc8ee98069a90132057d5e02a7982592/slide_1.jpg){kind=link}
