This document is in draft version
In this article we'll look into storage options available for HTML5.
// Store
localStorage.setItem("lastname", "Smith");
// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname");
sessionStorage object is like localStorage object but it stores data only for one session. The data will get deleted when user closes the browser window
if (sessionStorage.clickcount) {
sessionStorage.clickcount = Number(sessionStorage.clickcount) + 1;
} else {
sessionStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "You have clicked the button " +
sessionStorage.clickcount + " time(s) in this session.";
In this article we'll look into storage options available for HTML5.
Web storage
- Store data locally within user's browser. Earlier this was done using cookies.
- But Web Storage is secure and much faster.
- The data is not included with each server request.
- Possible to store large amounts of data without affecting site performance
- Stored in key-value pairs
localStorage.setItem("lastname", "Smith");
// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname");
sessionStorage object is like localStorage object but it stores data only for one session. The data will get deleted when user closes the browser window
if (sessionStorage.clickcount) {
sessionStorage.clickcount = Number(sessionStorage.clickcount) + 1;
} else {
sessionStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "You have clicked the button " +
sessionStorage.clickcount + " time(s) in this session.";
AppCache API
Cache the web application so that it is accessible without internet
To enable app cache, you must include manifest attribute in documents <html> tag
<!DOCTYPE HTML>
<html manifest="demo.appcache">
...
</html>
Every page with manifest attribute specified will be cached when the user visits it. The recommended file extension for manifest files is '.appcache'.
Geolocation API
- Offline browsing - Use the application offline
- Speed - Cached resources load faster
- Reduced server load - Will only load updated/changed resources from server
To enable app cache, you must include manifest attribute in documents <html> tag
<!DOCTYPE HTML>
<html manifest="demo.appcache">
...
</html>
Every page with manifest attribute specified will be cached when the user visits it. The recommended file extension for manifest files is '.appcache'.
Geolocation API
0 comments:
Post a Comment