mdn/js/4_client_side_web_APIs/6_client_side_storage

6_client_side_storage

dz / mdn / js / 4_client_side_web_APIs / 6_client_side_storage

Summary

Client-side storage

Node Tree

Nodes

client_side_storage
content client-side storage
children cookies, offline_asset_storage, uses, webstorage_indexeddb

uses
content uses
children offline, optimization, persistance, personalization
parents client_side_storage

persistance
content persisting previous site activity
children persistant_btwn_reloads
parents uses

personalization
content personalizing site preferences
parents uses

optimization
content saving data/assets for quicker reload
parents uses

offline
content save web docs locally for local use
parents uses

cookies
content cookies
children old_school
parents client_side_storage

old_school
content old school
parents cookies

webstorage_indexeddb
content WebStorage nad IndexedDB
children cache_api, indexed_db, web_storage_api
parents client_side_storage

web_storage_api
content WebStorage API: store/retrieve smaller data values name/value
children get_item, more_complex_than_web_storage (idb more complex than), persistant_btwn_reloads, remove_item, sep_storage_each_domain, set_item
parents webstorage_indexeddb

indexed_db
content IndexedDB: provides browser with complete DB system for storing complex data
children create_object_store, create_object_stores_within_db, more_complex_than_web_storage, object_store, open, storing_complex_data, transaction, upgradeneeded
parents webstorage_indexeddb

set_item
content SetItem(): save data item in storage
children get_item (related)
parents web_storage_api

cache_api
content Cache API: stores HTTP responses to specific request, useful for storing assets offline so site can be used without network connection.
children add_all, match, respond_with, used_with_cache_api
parents webstorage_indexeddb

get_item
content getItem(): retrieves data, given a name
parents web_storage_api, set_item

persistant_btwn_reloads
content persistant data between reloads
parents persistance, web_storage_api

remove_item
content removeItem(): given a name, removes item out of storage
parents web_storage_api

sep_storage_each_domain
content separate storage for each domain
parents web_storage_api

create_object_stores_within_db
content create object stores within db
children obj_stores_sim_db_table
parents indexed_db

more_complex_than_web_storage
content more complex than web storage API
parents web_storage_api, indexed_db

obj_stores_sim_db_table
content object stores similar to tables in relational DB, each object can contain a number of objects.
parents create_object_stores_within_db

open
content open()
children returns_req_add_event_handlers
parents indexed_db

returns_req_add_event_handlers
content returns request, add success/error event handlers
children result_contains_db
parents open

result_contains_db
content e.result contains the database
parents returns_req_add_event_handlers

upgradeneeded
content upgradeneeded: handler than runs when/if DB not set up or if DB opned with bigger version number than existing stored DB.
parents indexed_db

create_object_store
content createObjectStore()
children create_index
parents indexed_db

create_index
content createIndex()
parents create_object_store

transaction
content transaction()
parents indexed_db

object_store
content objectStore
children add, delete, open_cursor
parents indexed_db

add
content add()
parents object_store

open_cursor
content openCursor()
parents object_store

delete
content delete()
parents object_store

storing_complex_data
content storing complex data
children object_url, response_blob
parents indexed_db

response_blob
content respones.blob()
parents storing_complex_data

object_url
content object URL: internal URLs that point to blobs stored in memory.
children create_object_url
parents storing_complex_data

create_object_url
content URL.creatObjectURl()
parents object_url

offline_asset_storage
content offline asset storage
children service_worker
parents client_side_storage

service_worker
content service worker: JS file registered against origin, controls pages available at origin by setting between loaded page and intercepting network requests for that page.
children installing, registering, usually_saves_network_responses
parents offline_asset_storage

usually_saves_network_responses
content usually saves network responses
children used_with_cache_api
parents service_worker

registering
content registering
parents service_worker

used_with_cache_api
content used with Cache API to store requests
children match, respond_with
parents cache_api, usually_saves_network_responses

add_all
content Cache.addAll()
parents cache_api

respond_with
content respondWith()
parents cache_api, used_with_cache_api

match
content cache.match()
parents cache_api, used_with_cache_api

installing
content installing
parents service_worker