Understanding of local storage webstorage.

1. Local Storage Localstorage
Storage mode:
Stored as a key-value pair (key-value), permanently stored, and never invalidated unless manually deleted.
Size: 5M per domain
Support situation:
Note: IE9 Localstorage does not support local files, it needs to be the project to the server, to support!
Detection method:
if (window.localstorage) {
Alert (' This browser supports Localstorage ');
}else{
Alert (' This browser does not support Localstorage ');
}
Common APIs:
GetItem//Fetch Records
setiten//Setting record
removeitem//Removing records
key//the value corresponding to the key
clear//Clearing Records
What's stored:
arrays, images, JSON, styles, scripts ... (only content that can be serialized into strings can be stored)

2. Local Storage Sessionstorage

The localstorage in the HTML5 local storage API is the same as sessionstorage in the usage method, except that Sessionstorage is emptied after the page is closed, and Localstorage is saved.

3, offline cache (application cache)
Files required for the local cache app
How to use:
① Configuring Manifest files

on page:
<! DOCTYPE html> manifest file:
manifest file is a simple text file, It tells the browser what is cached (and what is not cached). The
manifest file can be divided into three parts:
①cache manifest-Files listed under this heading are cached after the first download
②network-Files listed under this heading require a connection to the server and are not cached
③fallback-Files listed under this heading provide a fallback page when the page is inaccessible (e.g. 404 pages)
Full demo:
CACHE MANIFEST
# 2016-07-24 V1.0.0/THEME.CSS
/ Main.js
NETWORK:
login.jsp
fallback:ml//offline.html
Server: The manifest file needs to be configured with the correct mime-type, i.e. "text/ Cache-manifest ".
such as Tomcat:
<mime-mapping>
<extension>manifest</extension>
<mime-type>text/ Cache-manifest</mime-type> </mime-mapping>
Common API:
Core is a Applicationcache object with a status property, Represents the current state of the app cache:

0 (uncached): No cache, no page-related app cache
1 (Idle): idle, that is, the app cache has not been updated
2 (CHECKING): Check that the profile is being downloaded and check for updates
3 (Downloading): downloaded, that is, the application cache is downloading the resource specified in the profile
4 (Updateready): Update complete, all resources have been downloaded
5 (IDLE): Obsolete, that is, the application cache description file no longer exists, so the page can not be revisited
Ask the app cache
Related events:
Represents a change in the application cache state:
Checking: Triggered when the browser looks for updates for the app cache
Error: Triggered when an error is sent while checking for updates or downloading resources
Noupdate: Triggers when checking the description file for no changes to the file
Downloading: triggered when the app cache resource is started downloading
Progress: Continuously download and trigger during file download application cache
Updateready: Trigger on page new app cache download completed
Cached: Triggers when the application cache is fully available
Three benefits of application cache:
① Offline Browsing
② Boost page load speed
③ Reduce server pressure

Understanding of local storage webstorage.